uni-app 小程序 uni-data-picker 设置为 disabled

背景

小程序端需要一个查看的操作，不能编辑分类，需要disabled 掉uni-data-picker。

实战

官方文档 说readonly可以禁用，于是尝试：

  <uni-data-picker
                        placeholder="请选择商品类型"
                        popup-title="请选择商品类型"
                        :localdata="shopGoodsTypes"
                        @change="changeType"
                        :value="detail.goodsTypeId"
                        :readonly="true"
                    ></uni-data-picker>

好家伙，连数据都不加载了……

设置5秒延时试试？网速慢的时候也解决不了问题……

换个思路，阻止input 弹出层不就ok 了?于是加了个disabled class，

  <uni-data-picker
                        placeholder="请选择商品类型"
                        popup-title="请选择商品类型"
                        :localdata="shopGoodsTypes"
                        @change="changeType"
                        :value="detail.goodsTypeId"
                       :class="disabled===true?'disabled':''"
                    ></uni-data-picker>

.disabled .uni-data-tree-input{
        pointer-events: none;
}

oh，解决！