欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue給?elementUI?中的?this.$confirm、this.$alert、?this.$prompt添加按鈕加載效果

 更新時間：2023年07月21日 11:58:40   作者：一顆不甘墜落的流星  
這篇文章主要介紹了Vue給?elementUI?中的?this.$confirm、this.$alert、?this.$prompt添加按鈕的加載效果,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
  • 主要使用 beforeClose 方法實(shí)現(xiàn) loading 的效果
  • beforeClose MessageBox 關(guān)閉前的回調(diào)，會暫停實(shí)例的關(guān)閉
function(action, instance, done)
1. action 的值為'confirm', 'cancel'或'close'。
2. instance 為 MessageBox 實(shí)例，可以通過它訪問實(shí)例上的屬性和方法。
3. done 用于關(guān)閉 MessageBox 實(shí)例。
  • 具體實(shí)現(xiàn)：（this.$confirm、this.$alert、 this.$prompt實(shí)現(xiàn)方法一樣）
this.$prompt('名稱', '新建表單', {
  confirmButtonText: '確定',
  cancelButtonText: '取消',
  beforeClose: async (action, ctx, close) => {
  	// 如果非確認(rèn)按鈕事件，則直接關(guān)閉彈窗
    if (action !== 'confirm') {
      close();
      return;
    }
    // confirmButtonLoading 是在 elementUI-message-box下的 main.vue 文件中封裝的參數(shù)
    ctx.confirmButtonLoading = true;
    try {
      // ctx.inputValue 獲取 input 輸入框的值
      await this.createApi(ctx.inputValue);
      // 提交成功后關(guān)閉窗口
      close();
    } catch (error) {}
    ctx.confirmButtonLoading = false;
  },
});

實(shí)現(xiàn)前：

在這里插入圖片描述

實(shí)現(xiàn)后：

在這里插入圖片描述

到此這篇關(guān)于Vue給 elementUI 中的 this.$confirm、this.$alert、 this.$prompt添加按鈕的加載效果的文章就介紹到這了,更多相關(guān)vue按鈕的加載內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評論