el-form表单的子项当选中后才能输入，并支持多选

要实现 el-form 表单的子项在选中后才能输入，并且支持多选的功能，您可以通过以下步骤进行操作：

1. 使用 el-checkbox-group 组件包裹多个 el-checkbox 组件，用于实现多选功能。
2. 在 el-form 中定义一个变量，例如 selectedItems，用于保存选中的子项。
3. 监听 el-checkbox 的 change 事件，在事件回调中更新 selectedItems 的值。
4. 在 el-form-item 的子项 el-input 上绑定 :disabled="!isSelected(item)" 属性，根据子项是否在 selectedItems 中来控制输入框的可用性。

具体的代码示例如下：

<template>
  <el-form ref="form" :model="form" label-width="120px">
    <el-form-item label="子项选择">
      <el-checkbox-group v-model="selectedItems" @change="handleCheckboxChange">
        <el-checkbox v-for="item in items" :label="item.value" :key="item.id">{{ item.label }}</el-checkbox>
      </el-checkbox-group>
    </el-form-item>
    <el-form-item v-for="item in items" :label="item.label" :key="item.id">
      <el-input :disabled="!isSelected(item)" v-model="form[item.id]"></el-input>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      form: {},
      items: [
        { id: 1, label: '选项1', value: 'option1' },
        { id: 2, label: '选项2', value: 'option2' },
        { id: 3, label: '选项3', value: 'option3' }
      ],
      selectedItems: []
    };
  },
  methods: {
    handleCheckboxChange() {
      // 清空已输入的值
      this.form = {};
    },
    isSelected(item) {
      return this.selectedItems.includes(item.value);
    }
  }
};
</script>

以上代码中，el-checkbox-group 组件用于多选，通过 v-model="selectedItems" 将选中的子项保存在 selectedItems 数组中。在 el-form-item 的子项 el-input 上，通过 :disabled="!isSelected(item)" 属性来控制输入框的可用性，isSelected 方法用于判断子项是否在 selectedItems 数组中。

这样，在 el-form 表单中，只有在选中对应的子项后，才能输入相应的内容。