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,可以获取改行的数据,并且可以进行各种操作
原文地址:https://blog.csdn.net/zhaoyy0513/article/details/100546651
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。