vueelement表格中模态框的使用解构赋值

10次阅读

共计 746 个字符,预计需要花费 2 分钟才能阅读完成。

main.js 中定义方法

/** 解构赋值
 * @param {*} arr1 key
 * @param {*} arr2 value*/
 
 Vue.prototype.assignment = function(arr1, arr2){ // 使用 Element loading-start 方法
      arr1.map((item,index)  => {this[item] = arr2[index]
      })
}
// 在函数中传入两个数组, 第一个数组中的每一项, 一一对应等于第二个数组的每一项, 例如 :
arr1=[name,age]  arr2=['张三','18']
assignment (arr1, arr2)  得到:
name='张三',age='18'  

表格中的内容

<el-table-column label="操作" min-width="100" class="caozuo">
        <template slot-scope="scope" v-if="scope.row.state != 3">
            <div class="caozuoBtn" @click="assignment(['currentItem','dialogUrgentVisible'], [scope.row, true])"> 催办 </div>                  
        </template>
 </el-table-column>
    

data 中的数据

data(){
    return:{currentItem: {}, // 当前操作行
       dialogUrgentVisible: false,    // 模态框 (控制显示隐藏)
    }
}
// 点击催办按钮, 调用 assignment() 函数传入两个数组得到
    this.currentItem=scope.row
    this.dialogUrgentVisible=true
    让模态框显示, 并把当前行的数据储存到 currentItem 中

正文完
 0