vue.js - el-form设置全局disabled属性之后，子组件怎么设置disabled属性?

Question

el-form设置全局disabled属性之后，子组件怎么设置disabled属性?

 <el-form ref="form" :model="sizeForm" label-width="80px" size="mini" :disabled="true">  <el-form-item label="活动名称">    <el-input v-model="sizeForm.name"></el-input>  </el-form-item> <el-form-item label="活动形式">    <el-input type="textarea" v-model="form.desc" :disabled="false"></el-input>  </el-form-item></el-form>

因为el-form设置了全局了disabled属性属性，活动形式项设置的:disabled="false"设置失效了，有什么方法可以使得子项设置的:disabled="false"生效？

尝试了在el-form-item外面包裹一层el-from,虽然设置的:disabled="false"属性可以生效了，但是由于又包裹了一层el-from。校验会出问题

<el-form><el-form-item label="活动形式">    <el-input type="textarea" v-model="form.desc" :disabled="false"></el-input>  </el-form-item></el-form>

Answer 1

el-form设置了全局了disabled属性后，属于这个form内的所有表单就会被禁用，如果需要单独在控制某个表单，可以在该 el-form-item 内部嵌套一个新的 el-form

Answer 2

注意看文档中的解释：

所以就是一个一个给表单内组件做 disabled，而不是给整个 form 表单做 disabled。

因为组件内部是这样做的处理 ��

// el-inputexport default {  name: 'ElInput',  //...  computed: {    //...    inputDisabled() {      return this.disabled || (this.elForm || {}).disabled;    },  }}

element/packages/input/src/input.vue at dev · ElemeFE/element

所以即使组件的 :disabled="false" 而 form 表单设置了 :disalbed="true"，按照或(||)的判断逻辑组件依旧会被禁用。