vant-weapp中picker默认选中无效问题

起因

需要做一个收货地址的省份选择器，已经存在的地址信息需要回显，回显成功后点击选择器，需要在当前值得位置。

<van-picker
  show-toolbar
  title="选择省份"
  value-key="name"
  default-index="{{ state_index }}"
  columns="{{ stateColumns }}"
  bind:confirm="onStateConfirm"
  bind:cancel="onStateClose"
/>
复制代码

设置了默认选中的索引default-index的值为 state_index，没有效果。

查了一下，原来default-index不能动态修改，如果想要动态修改默认值，需要使用setColumnIndexAPI，像下面这样：

<van-picker
  show-toolbar
  title="选择省份"
  class="state_default"
  value-key="name"
  columns="{{ stateColumns }}"
  bind:confirm="onStateConfirm"
  bind:cancel="onStateClose"
/>
复制代码

// 回显学生的省份信息
this.data.stateColumns.forEach((item, index) => {
  if (item.id === this.data.state_id) {
    
    this.setData({
      state_index: index,
      state_name: item.name
    })
    const picker = this.selectComponent(".state_default"); // 获取组件实例
    picker.setColumnIndex(0, index);
  }
})
复制代码

很遗憾，仍然无效！！！！

找了很久的原因，最后发现，只有在picker打开时，动态设置索引才能有效。

像这样：

<van-picker
  show-toolbar
  title="选择省份"
  class="state_default"
  value-key="name"
  columns="{{ stateColumns }}"
  bind:confirm="onStateConfirm"
  bind:cancel="onStateClose"
/>
复制代码

// 省份选择打开
provincesSelect () {
  this.setData({
    pickerShow: true
  })
  const picker = this.selectComponent(".state_default"); // 获取组件实例
  picker.setColumnIndex(0, this.data.state_index);
},
复制代码

完美解决！