element Vue 不同按鈕控制同一個 el-dialog 彈窗的 title 動態顯示內容

1. 定義一個變量 dailogTitleType

<el-dialog :title="dailogTitleType+'圖片'" :visible.sync="dialogVisible" width="600px" ></el-dialog>

2. 返回一個空的變量

export default {
  data() {
    return {
      dialogTitleType:''
    }
  }
}

3. 在對應按鈕的onclik方法里加入dialogTitleType變量的默認值

<el-button type="primary" size="mini" @click="handleAdd">添加圖片</el-button>

<el-button type="primary" size="mini" @click="handleEdit">編輯</el-button>

 //點擊新增按鈕觸發函數
 handleAdd: function(index, row) {
   this.dailogTitleType ="添加";
   this.addPictureDialogVisible = true;
   this.form = Object.assign({}, row);
 },
 //點擊編輯按鈕觸發函數
 handleEdit: function(index, row) {
   this.dailogTitleType ="編輯";
   this.addPictureDialogVisible = true;
   this.form = Object.assign({}, row);  
 },

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章