(vue)el-tabs选中最后一项后更新数据后无法展开
(vue)el-tabs选中最后一项后更新数据后无法展开
效果:
原因:选中时绑定的值在数据更新后找不到
思路:更新数据时把选中的v-model的属性赋为初始值
写法:
<el-form-item label="字段选择"><el-tabsv-model="activeNameField" //选中的tabtype="border-card"@tab-click="handleClickField"//点击的选项信息><el-tab-panev-for="(ae, ai) in Object.keys(ziduanObj)":key="ai":label="ae":name="String(ai)" //name赋的是索引下标>...</el-tab-pane></el-tabs>
</el-form-item>
js:
<script>
export default {data(){return {activeNameField: '0'}},methods:{ // 字段tabhandleClickField(tab, event) {console.log(tab) console.log(this.activeNameField)},// 下拉框改变事件selectChange() {this.activeNameField = '0' //恢复初始默认的第一个选项}
}
</script>