icon: ''
tags:
  en:
    - picker
    - form
  zh-CN:
    - 选择
    - 表单
    - 联动
extra: |

  <p class="warning">
    请确保列表项的`value`值是字符串，使用数字会出错。
    <br />
    如果你的业务接口返回数字值为数字，需要你先处理成字符串；同样，获取到值时为字符串，你需要自己转换成数字。
  </p>

  非联动情况下，列表数据格式示例：

  ``` js
  // data
  [['小米', 'iPhone', '华为', '情怀', '三星', '其他', '不告诉你'], ['小米1', 'iPhone2', '华为3', '情怀4', '三星5', '其他6', '不告诉你7']]

  // 或者使用 name => value 的形式
  [[{
    name: '2019届5班',
    value: '1'
  }, {
    name: '2019届4班',
    value: '2'
  }]]

  // value
  ['小米', '小米1']
  ```

  联动时，列表数据格式示例：

  ``` js
  // data
  [{
    name: '中国',
    value: 'china',
    parent: 0
  }, {
    name: '美国',
    value: 'USA',
    parent: 0
  }, {
    name: '广东',
    value: 'china001',
    parent: 'china'
  }, {
    name: '广西',
    value: 'china002',
    parent: 'china'
  }, {
    name: '美国001',
    value: 'usa001',
    parent: 'USA'
  }, {
    name: '美国002',
    value: 'usa002',
    parent: 'USA'
  }, {
    name: '广州',
    value: 'gz',
    parent: 'china001'
  }, {
    name: '深圳',
    value: 'sz',
    parent: 'china001'
  }, {
    name: '广西001',
    value: 'gx001',
    parent: 'china002'
  }, {
    name: '广西002',
    value: 'gx002',
    parent: 'china002'
  }, {
    name: '美国001_001',
    value: '0003',
    parent: 'usa001'
  }, {
    name: '美国001_002',
    value: '0004',
    parent: 'usa001'
  }, {
    name: '美国002_001',
    value: '0005',
    parent: 'usa002'
  }, {
    name: '美国002_002',
    value: '0006',
    parent: 'usa002'
  }]
  ```

props:
  value:
    type: Array
    default: ''
    en: 'picker value, use `v-model` for binding'
    zh-CN: '表单值，使用 `v-model` 绑定'
  data:
    type: Array
    default: ''
    en: array list
    zh-CN: 选项列表数据
  columns:
    type: Number
    en: how many columns in chained-mode
    zh-CN: 指定联动模式下的列数，当不指定时表示非联动
  fixed-columns:
    type: Number
    en: how many columns will show
    zh-CN: 指定显示多少列，隐藏多余的
  id:
    type: String
    en: the id of item element, that is needed in ssr model
    zh-CN: 列表元素的id, ssr时需要指定
events:
  on-change:
    params: '`(value)`'
    en: emits when value is changed
    zh-CN: 选择值变化时触发
changes:
  v1.3.4:
    en:
     - '[fix] Fix server-side rendering of the dom without updating'
    zh-CN:
     - '[fix] 修复服务器端渲染dom不更新'
  v1.3.5:
    en:
     - '[fix] Scroller [Methods __scrollingComplete] is modified
      to be rounded up when the roll is finished. [Methods setDimensions] is used to set the position'
    zh-CN:
     - '[fix]scroller【Methods __scrollingComplete】滚动完成的时候修改成了向上取整，[methods setDimensions]设置位置的时候使用了向下取整'
  v1.3.6:
    en:
     - '[fix] Fix current value changes to trigger event logic'
    zh-CN:
     - '[fix] 修复当前值变化触发事件逻辑'