微信小程序优化：实现picker组件中input输入框禁止输入，而只能通过picker组件选择日期

原来的代码如下：

<view class="right">

    <picker mode="date" value="{{material.arriveToDate}}" bindchange="changeDate2">

        <input placeholder="请输入预计到货时间" name="arriveToDate" value="{{material.arriveToDate}}"/>

    </picker>

</view>

由于对input输入框没有禁用，导致你仍然可以输入内容，效果如下：

 

 代码优化，在input输入框中加入disabled属性：

<view class="right">
   <picker mode="date" value="{{material.arriveToDate}}" bindchange="changeDate2">
       <input placeholder="请输入预计到货时间" name="arriveToDate" value="{{material.arriveToDate}}" disabled/>
   </picker>
</view>

加入disabled属性之后，由于输入框禁用，所以无法输入，而只能选择日期。

 注意：不是所有的picker组件都要加入disabled组件，因为搜索框中选择后的日期还需要清空，如果加了disabled属性，选择了日期之后就无法清空，而是只能修改日期。

 如果是修改日期，则要加disabled属性。

如果要实现picker组件中input输入框禁用与picker组件禁用，则需要在picker标签和input标签中都加disabled属性，

示例代码如下：

<view class="right">
   <picker mode="date" disabled value="{{material.arriveToDate}}" bindchange="changeDate1">
       <input placeholder="预计到货日期" name="arriveToDate" value="{{material.arriveToDate}}" disabled/>
   </picker>
</view>