Element-UI Form 表单 disabled 属性继承原理

element-ui form 表单的 disabled 属性向下传递原理

<el-form-item label="姓名" :disabled="disabled">
  <el-input v-model="form.name" :disabled="disabled"></el-input>
</el-form-item>

disabled 属性用 inject 和 provide 传递下去的。

export default {
  name: 'Form',
  props: {
    disabled: {
      type: Boolean,
      default: false,
    },
  },
  setup(props) {
    provide('disabled', props.disabled);
  },
};

export default {
  name: 'FormItem',
  inject: ['disabled'],
};

参考文章：https://juejin.cn/post/6844903999846481928