这里想通过点击按钮打开抽屉,由于抽屉较多,这里我用数组存储了
按钮
<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) },