weex-nuke
Version:
基于 Rax 、Weex 的高性能组件体系 ~~
69 lines (48 loc) • 1.66 kB
Markdown
# Picker
- category: UI
- chinese: 选择器
- type: UI组件
---
## 何时使用
一个通用选择器,类似于 web 的 select 组件。 目前仅支持一维数组的情况。
## API
### Picker.show(options,onSelect,onCancel)
- options 参数
| 参数 | 说明 | 类型 | 默认值 |
| :---------- | :----------------------- | :----- | :------------------------------- |
| title | 标题 | string | |
| dataSource | 数据源, 树形结构或数组 | array | |
| selectedKey | Picker的默认值(非受限) | number | 0 |
| locale | 确认取消按钮文案 | object | {cancel: '取消',confirm: '确认'} |
- onNotify:Picker点击确认触发的事件
- onCancel:Picker取消触发的事件
- dataSource 结构
````js
let data = [ 'Rick' ,'Morty' ,'Hulk' , 'Iron Man' ]
````
- selectedKey
````js
// 数组索引
selectedKey: 1
````
````js
Picker.show({
title: 'Please choose',
dataSource: data,
selectedKey: this.state.selected,
hasBottomButton:true, // 底部按钮
hasToolbar:true, // 头部
hasToolbarButton:false,// 头部确定、取消按钮
}, (result) => {
this.setState({
data: data[result.data],
selected: result.data
});
}, (e) => {
console.log('canceled')
});
````
## 其他
- bug、建议联系 <a href="dingtalk://dingtalkclient/action/sendmsg?dingtalk_id=kjwo3w5">@翊晨</a>
- 钉钉交流群
<img src="https://img.alicdn.com/tfs/TB101EESpXXXXXFXpXXXXXXXXXX-1122-1362.jpg" width="260" />