首頁猿問 vue組件激活...

vue組件激活 element-ui dialog 無法關(guān)閉?

JavaScript

繁華開滿天機 2019-03-03 12:54:14

rt,vue 組件中激活 element-ui中的 dialog ,dialog 無法關(guān)閉app.vue <el-dialog title="收貨地址" :visible.sync="dialogVisible"></el-dialog> computed: { dialogVisible() { return this.$store.state.isDialogVisible; } }組件中:<el-button @click="showDialog()">登錄</el-button> methods: { showDialog() { this.$store.commit({ type: "showDialog" }); }}store.js中: export default new Vuex.Store({ state: { isDialogVisible: false }, mutations: { showDialog(state) { state.isDialogVisible = true; }激活組件以后,isDialogVisible一直保持 true 的狀態(tài), 無法通過點擊頁面來關(guān)閉.求解.

查看完整描述

2 回答

繁星點點滴滴

TA貢獻1803條經(jīng)驗獲得超3個贊

點擊頁面關(guān)閉的時候，其實觸發(fā)了update:visible這個事件,作用是把新值賦值給綁定的變量，大概等于dialogVisible=false，然后你的dialogVisible是放在vuex里的，所以要改變一下寫法。

//store.jsmutations: {
  hideDialog(state) {
    state.isDialogVisible = false;
}

//app.vuedialogVisible: {  get:function(){ 
    return this.$store.state.isDialogVisible; 
  },  
  set:function(val){    this.$store.commit({ type: "hideDialog" });
  }
}

反對回復(fù) 2019-03-03