picker默认值设置

Question

如下代码：

<picker bindchange="bindPickerChange" range="["已婚","未婚","离异"]" value="0">

这样展现出来的就是range中的三个选项。

我的需求是要实现

默认显示"请选择"，当点击picker后弹出的才是这三个选项，请问这样该如何实现？

目前想到的是在range中添加第一项为“请选择”，但这样沉余数据会很多，因为有数个picker，请问这个需求该如何实现？小程序文档中picker已经查看，但没找到答案！

Answer 1

<picker bindchange="bindReasonChange" range="{{refundReasons}}" value="{{index}}"  class='item-right'>
    <view class="picker">{{refundReason?refundReason:"请选择"}}</view>
</picker>

data: {    
    refundReason: '',
    refundReasons: ['不喜欢', '买错了', '不小心排重了']
  }

通过一个三目运算即可实现

Answer 2

和上面三元运算符那位答案相似
.wxml文件中：

<picker bindchange="typeChange" value="{{typeIndex}}" range="{{types}}">
    <view class="picker">{{typeIndex==null ? "请选择" : types[typeIndex]}}</view>
</picker>

.js文件中

Page({
   data: {
      types:["喜欢","一般","讨厌"],
      typeIndex:null
   },
    typeChange(event){
      this.setData({
            typeIndex:event.detail.value
      })
   }
})