怎么获取<el-table-column prop="tagNames" :label="t('checkEvaluate.tagNames')" show-overflow-tooltip>中 tagNames的值?
时间: 2024-03-01 16:49:39 浏览: 17
如果该 `<el-table-column>` 是在一个 Element UI 的 `<el-table>` 组件中使用的,你可以在 `<el-table>` 组件中监听 `row-click` 或 `cell-click` 事件,在事件处理函数中获取当前行数据对象,然后通过该对象的 `tagNames` 属性来获取其值,例如:
```vue
<template>
<el-table :data="tableData" @row-click="handleRowClick">
<el-table-column prop="tagNames" :label="t('checkEvaluate.tagNames')" show-overflow-tooltip>
<template #default="scope">
<el-row>
<el-tag class="mb2 mt2 ml2 mr2" v-for="item in scope.row.tagNames">{{ item.name }}</el-tag>
</el-row>
</template>
</el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
tableData: [
{
id: 1,
tagNames: [
{ name: "tag1" },
{ name: "tag2" },
{ name: "tag3" }
]
},
{
id: 2,
tagNames: [
{ name: "tag4" },
{ name: "tag5" }
]
}
]
};
},
methods: {
handleRowClick(row) {
const tagNames = row.tagNames;
console.log(tagNames);
}
}
};
</script>
```
在 `handleRowClick` 方法中,`row` 参数即为当前行的数据对象,可以通过 `row.tagNames` 来获取其值。