elementUI 实现table 中组件能够输入和点击

1.开发需要，在table中嵌入了form表单的一些组件，但是不能对组件进行操作，比如input不能输入，按钮不能点击等等

2.解决方法 在组件外围添加一层template 并声明scope，代码如下:

1.input框
          <el-table-column align="center" prop="number" label="数量" width="80">
            <template scope="scope">
              <el-input v-model="scope.row.number" size="mini"></el-input>
            </template>
          </el-table-column>

2.switch按钮
          <el-table-column align="center" prop="whetherCanUse" label="是否可用">
            <template scope="scope">
              <el-switch
                v-model="scope.row.whetherCanUse"
                active-color="#13ce66"
                inactive-color="#ff4949"
              >
              </el-switch>
            </template>
          </el-table-column>

3.操作的时候直接绑定即可

      this.mixData.number = 1; // 将数量默认设置为1
      this.mixData.whetherCanUse = true;

4.原理大致就是外围绑定一个scope，可以获取改行的数据，并且可以进行各种操作