1. 在el-tree-select中change事件使用
如果直接传递row, 拿到的不是最新的row的数据, 使用$index结合tableData来拿row
javascript
<el-table-column prop="directory" label="所属目录树">
<template #default="scope">
<el-tree-select v-model="scope.row.areaTreeNodeId" :data="dirTreeData" placeholder="请选择"
popper-class="dircat-tree-select" @change="(val) => handleTreeChange(scope.$index, 'dir', val)"
@node-click="(node) => handleDirNodeClick(scope.row, node)" />
</template>
</el-table-column>
javascript
// 处理树的变化(目录树或分类树)
const handleTreeChange = async (index, treeType, value) => {
console.log(index, treeType, value, 'rowhandleTreeChange目录树');
let row = tableData.value[index]
console.log(row, 'row>>>');
if (!row) return ElMessage.error('无法获取表格行数据')
if (value && row.dataId) {
const treeData = {
relatedId: row?.relatedId?.toString(), // 关联id
sceneId: commonStore.sceneId, // 场景id
areaTreeNodeId: treeType == 'dir' ? value : row.areaTreeNodeId, // 区域树节点id
areaTreeNodeName: treeType == 'dir' ? row.dirNode?.label : row.areaTreeNodeName, // 区域树节点名称
classifyTreeNodeId: treeType == 'cat' ? value : row.classifyTreeNodeId, // 分类树节点id
classifyTreeNodeName: treeType == 'cat' ? row.catNode?.label : row.classifyTreeNodeName, // 分类树节点名称
dataId: row.dataId // 数据dataId
}
try {
const res = await batchAddSceneDataRelation([treeData])
if (res.code == 200) {
ElMessage.success(`${treeType === 'dir' ? '目录' : '分类'}树绑定成功`)
} else {
ElMessage.error(`${treeType === 'dir' ? '目录' : '分类'}树绑定失败`)
}
} catch (error) {
ElMessage.error(`${treeType === 'dir' ? '目录' : '分类'}树绑定失败`)
}
}
getDataList()
}