vivo-ui
Version:
vivo ui component lib for vue
78 lines (62 loc) • 1.95 kB
Markdown
# popup-picker 弹层选择器
> popup-picker是一个弹层选择器
[demo](demo/components/popup-picker.html ':ignore')
## 使用方法
```
<button ="show=!show">开关</button>
<popup-picker appear v-model="show" :data="data" :selected="selected" :enable3d="enable3d" :sync="sync"
="update" ="confirm"></popup-picker>
```
```
import {PopupPicker} from 'vivo-ui';
export default {
components: {
PopupPicker
},
data: {
show: true,
data: function () {
var num = 3;
function deep() {
var index = arguments[0] || 0,
data = {
name: 'label' + index,
options: []
};
for (var i = 0; i < 60; i++) {
data.options.push((index < num - 1) && Math.random() > 0.5 ? {
value: index + '-' + (arguments[1] || 0) + '-' + i,
children: deep(index + 1, i)
} : index + '-' + (arguments[1] || 0) + '-' + i);
}
return data;
}
return deep();
}(),
selected: [0, 0, 0],
enable3d: true,
sync: true
},
methods: {
update(value){
console.log(value);
},
confirm(value){
console.log(value);
},
}
};
```
## 属性
名称|类型|必填|默认值|描述
:-:|:-:|:-:|:-:|:-:
v-model|`Boolean`|`Y`|`-`|是否显示
title|`String`|`N`|`请选择`|标题,为空不显示
cancel|`String`|`N`|`取消`|取消按钮文本,为空不显示
confirm|`String`|`N`|`确定`|确定按钮文本,为空不显示
> 其他属性与picker一致
## 事件
名称|参数|说明
:-:|:-:|:-:
confirm|`{value}`|点击确定按钮时触发,参数同update事件
> 其他事件与picker一致