vue 判断表格字段绑定v-model
时间: 2023-07-01 15:28:44 浏览: 126
如果你要在表格中绑定 `v-model`,可以使用 `scoped slots`,然后在 slot 中绑定 `v-model`,以便你可以对表格数据进行修改。
假设你的表格数据是一个数组 `tableData`,其中每个元素都有一个 `name` 字段,你想要在表格中绑定 `v-model`,以便你可以编辑该字段。你可以这样做:
在你的表格列定义中,为 `name` 字段定义一个 `scoped slot`,然后在 slot 中绑定 `v-model`:
```
<el-table-column label="名称">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="请输入名称"></el-input>
</template>
</el-table-column>
```
这样,你就可以在表格中编辑每个元素的 `name` 字段了。
如果你想要在编辑时进行其他操作,可以使用 `@change` 事件,它会在 `v-model` 改变时触发:
```
<el-table-column label="名称">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="请输入名称" @change="handleNameChange(scope.row)"></el-input>
</template>
</el-table-column>
methods: {
handleNameChange(row) {
console.log('name changed', row.name)
// do something else
}
}
```
这样,每次编辑某个元素的 `name` 字段时,都会触发 `handleNameChange` 方法。你可以在该方法中进行其他操作,例如保存修改等。
阅读全文