# Picker > 引用： import Picker from 'zhidian-ui/lib/picker' ### 多列联动关系 :::demo ```html ``` ```javaScript ``` ::: ### 默认，不设置默认值时选中第一个 :::demo ```html {{year12}} ``` ```javaScript ``` ::: ### 异步加载及动态改变数据 :::demo ```html 设置数据一 设置数据二 设置数据三 ``` ```javaScript ``` ::: ### 双向绑定 :::demo ```html {{one.name}} ``` ```javaScript ``` ::: ### 非联动多列 :::demo ```html ``` ```javaScript ``` ::: ### Picker Attributes | 参数 | 说明 | 类型 | 可选值 | 默认值 | |---------- |------------- |---------------|------------ |-------- | | value | 表单值，使用 v-model 绑定 | `Array` | — | — | | data | 选项列表数据 | `Array` | — | — | | columns | 指定联动模式下的列数，当不指定时表示非联动 | `Number` | — | — | | fixed-columns | 指定显示多少列，隐藏多余的 | `Number` | — | — | | column-width | 定义每一列宽度，只需要定义除最后一列宽度，最后一列自动宽度， 比如对于3列选择，可以这样：[1/2, 1/5] | `Array` | — | — | ### Picker Event | 名称 | 参数 | 描述 | |---------- |------------- |---------------| | on-change | 请自行参照arguments | 选择值变化时触发 | ### Picker Methods | 名称 | 参数 | 描述 | |---------- |------------- |---------------| | getNameValues | | 根据 value 获取字面值 |