<template>
<div>
<el-table :data="tableData" :key="num">
<el-table-column
prop="name"
label="名称"
header-align="center"
align="left"
min-width="120"
:show-overflow-tooltip="true"
/>
<el-table-column label="字段">
<template slot-scope="scope">
<div style="display: flex">
<el-input
:disabled="!scope.row.editable"
style="margin-right: 10px"
></el-input>
<el-button
@click="addData(tableData, scope.$index, scope.row)"
type="text"
>添加</el-button
>
</div>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: "fdqyQiYeJiBenXinXiAudit",
data() {
return {
tableData: [],
num: 0,
};
},
methods: {
//方法一,点击按钮加1
addData(data, index, row){
num++
}
},
};
</script>
方法二,用set方法更新
// 方法二
add(data, index, row){
//两种都可以
this.$set(data, index, row)
//this.$set(this.tableData,index,row)
}
方法三,利用数据变化,触发更新
// 方法三 检测到数据变化,更新视图
add(data, index, row) {
this.data.splice(1, 0);
},