1、原始的寫法以及問題
<van-popup show="{{ showPopup && cellClick === 'Freq' }}" position="bottom" bind:close="onPopupClose"><van-picker value-key="Spec" show-toolbar title="{{cellClick === 'Freq' ? showPcChangeTitle : ''}}" columns="{{ cellClick === 'Freq' ? pcColumns : hcColumns }}" default-index="{{hcDefaultIndex}}" bind:cancel="onPickerCancel" bind:confirm="onPickerConfirm" bind:change="onPickerChange" />
</van-popup>
之前用 popup 結合現實 picker 顯示默認值
在 onload 的時候修改默認值
const index = this.data.hcColumns.findIndex(s => s.Id === item.PrescriptionConsumableInputDtos[0].ConsumableId)this.setData({showHcName: this.data.hcColumns.filter(s => s.Id === item.PrescriptionConsumableInputDtos[0].ConsumableId)[0].Name,hcDefaultIndex: index})
結果發現雖然hcDefaultIndex的值確實改變了 但是實際上頁面上并沒有顯示為正確的選項
具體可以看 GitHub 上的一些評論單列picker,設置default-index,不起作用 · Issue #1636 · youzan/vant-weapp · GitHub
2、解決辦法
在van-popup上加一個wx:if就可以了(單列和多列都是相同的修改辦法)
<van-popup wx:if="{{ showPopup && cellClick === 'Freq' }}" show="{{ showPopup && cellClick === 'Freq' }}" position="bottom" bind:close="onPopupClose"><van-picker id="freqPicker" show-toolbar title="{{showPcChangeTitle}}" columns="{{pcColumns}}" bind:cancel="onPickerCancel" bind:confirm="onPickerConfirm" bind:change="onPickerChange" />
</van-popup>