Vue设置输入框、下拉框不可修改

2022-04-21  本文已影响0人  萤火驻守心间
image.png

通过绑定a-input、j-tree-select的disabled属性实现不可修改

           <a-col :span="12">
              <a-form-model-item label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="connectMobile">
                <a-input :disabled=true v-model="model.connectMobile" placeholder="请输入联系电话" maxlength="11"></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="12">
              <a-form-model-item label="运营商" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="operateRegion">
                <j-tree-select
                  ref="treeSelect"
                  placeholder="请选择运营商"
                  v-model="model.operateRegion"
                  dict="bus_operation_region,name,id"
                  pidField="parent_id"
                  pidValue="0"
                  hasChildField="has_child"
                  :disabled=true
                >
                </j-tree-select>
              </a-form-model-item>
            </a-col>

效果为:


image.png

注意如果写为disabled="true",可能报错Invalid prop: type check failed for prop "disabled". Expected Boolean, got String with value "true".

上一篇下一篇

猜你喜欢

热点阅读