解决:
将已更改的最新的数组数据深拷贝并重新赋值给原数组
代码示例
<template>
<section class='table-wrapper'>
<el-table class="option-table"
:border="true"
:data="optionList"
tooltip-effect='light'
style="width: 100%">
<el-table-column width='80'>
<template slot-scope="scope">选择</template>
</el-table-column>
<el-table-column show-overflow-tooltip
prop="title"
min-width='100'
label="选项">
</el-table-column>
<el-table-column prop="sceneSearchCount"
min-width='110'
label="跳转到">
<template slot-scope="scope">
<span class="search-select-box">
<el-select
v-model="scope.row.targetId"
clearable
@change="changeOptionTarget()"
placeholder="请选择要跳转到的题目">
<el-option
v-for="item in targetQuestionList"
:key="item.id"
:label="item.label"
:value="item.id">
</el-option>
</el-select>
</span>
</template>
</el-table-column>
</el-table>
</section>
</template>
<script>
export default {
data () {
return {
optionList: [], // 当前题目选项列表
targetQuestionList: [ // 可以选择的目标题列表
{label: '不跳转,按顺序填写下一题', id: 0},
{label: '跳到问卷末尾结束作答', id: 1},
{label: '直接提交为无效答卷', id: -1}
],
}
},
methods: {
// 表格下拉菜单
changeOptionTarget () {
let optionList = JSON.parse(JSON.stringify(this.optionList))
this.optionList = optionList
}
}
}
</script>