PickerView 选择器
PickerView 的功能类似于 Picker ,但它是直接渲染在区域中,而不是弹出窗口。
代码演示
选择器
import { PickerView } from 'antd-mobile';
const seasons = [
[
{
label: '2013',
value: '2013',
},
{
label: '2014',
value: '2014',
},
],
[
{
label: '春',
value: '春',
},
{
label: '夏',
value: '夏',
},
],
];
class PickerViewExample extends React.Component {
state = {
value: null,
};
onChange = (value) => {
console.log(value);
this.setState({
value,
});
};
render() {
return (
<PickerView
onChange={this.onChange}
value={this.state.value}
data={seasons}
cascade={false}
/>
);
}
}
ReactDOM.render(<PickerViewExample />, mountNode);
API
适用平台:WEB、React-Native
属性 | 说明 | 类型 | 默认值 |
---|
data | 数据源 | Array<{value, label}> / Array<Array<{value, label}>> | - |
value | 值, 格式是[value1, value2, value3] , 对应数据源的相应级层value | Array | - |
cascade | 是否级联 | Boolean | true |
cols | 列数 | Number | 3 |
onChange | 选中后的回调,可使用rc-form | (val): void | - |
prefixCls (Web Only ) | prefix class | string | am-picker |
pickerPrefixCls (Web Only ) | picker prefix class | string | am-picker-col |
itemStyle | 每列样式 | Object | - |
indicatorStyle | indicator 样式 | Object | - |