小程序之隐藏显示功能

本文就input输入框的显示影藏功能来絮叨一下，顺便让自己更深的记忆。

• 结构层

<view class="section {{reply?'on':'off'}}">
    <input placeholder="请输入所预约项目" type="text"/>
</view>

是的，没错！上面用了三元运算符。与wx:if标签写法相比，显然更加简洁优雅。

• 表示层

.on{display: block}
.off{display: none}

• 行为层

data: {
    ...
    ...
    reply: false,
    ...
    ...
  },
  bindCasPickerChange: function (e) {

    if (e.detail.value == '条件'){
      this.setData({ reply:true})
    }else{
      this.setData({ reply: false })
    }
    this.setData({
      casIndex: e.detail.value
    })
  },