首页 > 其他分享 >vue 中数组值改变但页面未渲染问题

vue 中数组值改变但页面未渲染问题

时间:2023-03-05 21:02:49浏览次数:34  
标签:vue 渲染 改变 set 数组 按钮 抽屉 页面

这里想通过点击按钮打开抽屉,由于抽屉较多,这里我用数组存储了
按钮
<el-button @click="drawer[index]=true" type="primary" size="small">
抽屉
<el-drawer :title=subject[index].title :visible.sync="drawer[index]" :with-header="false"> <div>答案:{{subject[index].ans}}</div> <span>解析:</span> <div>{{subject[index].ana}}</div> </el-drawer>
点击后发现drawer的值确实改变了,但抽屉并没有打开。

这里查出直接改变数组中的值并不会重新渲染界面,需要使用push或者set。
按钮改成
<el-button @click="openDrawer(index)" type="primary" size="small">
并在script中加入 //直接改变数组中的值并不会重新渲染界面,需要使用push或者set openDrawer(val) { this.$set(this.drawer,val,true) },

标签:vue,渲染,改变,set,数组,按钮,抽屉,页面
From: https://www.cnblogs.com/lisuhang/p/17181616.html

相关文章