element ui switch開關 點選按鈕後,彈窗確認再改變開關狀態

ymumi發表於2018-11-14
<el-switch
        v-model="autoUpdate"
        active-color="#5eb058"
        inactive-color="#cccccc"
        disabled
        @click.native="handelUpdate(autoUpdate)">
 </el-switch>
.el-switch.is-disabled .el-switch__core, .el-switch.is-disabled .el-switch__label{
      cursor: pointer;
    } 
 // 點選開啟開關
    handelUpdate (autoUpdate) {
      let strOpen = '是否確認開啟開關。'
      let strClose = '是否確認關閉開關。'
      if (!autoUpdate) {
       // 彈窗詢問,這個是封裝過的element ui 彈窗
      this.wConfirmTip('開啟開關', strOpen, () => {
        this.autoUpdate = true
        })
      } else {
        this.wConfirmTip('關閉開關', strClose, () => {
          this.autoUpdate = false
        })
      }
    },

前面直接貼程式碼了。

需求:點選開關,根據開啟或者關閉轉態,彈出彈窗詢問是否開啟/關閉,點選確認開啟後開關顯示成為開啟狀態樣式。

相關文章