vue element 新增、编辑类Dialog公用函数

调用

1 <el-button type="primary" class="my-button" size="small" :loading="editLoading" @click="submitDialogInfo('edit')">确 定</el-button>
2 
3 <el-button type="primary" class="my-button" size="small" :loading="addLoading" @click="submitDialogInfo('add')">确 定</el-button>

axios

// api
import * as category from 'api/subjectManage/category';

js

 1 // 弹框内容提交
 2         submitDialogInfo(formName) {
 3             const that = this;
 4             const _form = `${formName}Form`;
 5             const _loading = `${formName}Loading`;
 6             const _dialog = `${formName}Dialog`;
 7             that.$refs[_form].validate(function(valid) {
 8                 that[_dialog] = true;
 9                 if (valid) {
10                     // data
11                     const data = that[_form];
12                     // name
13                     let match_name = `${formName}Info`;
14                     for (let key in category) {
15                         if (match_name === key) {
16                             // function
17                             category[key](data)
18                                 .then(res => {
19                                     that[_loading] = false;
20                                     if (res.data && (!res.data.code || res.data.code === 200)) {
21                                         // 关闭弹框
22                                         that[_dialog] = false;
23                                         that.$message.success('数据更新成功');
24                                         // 刷新数据
25                                         that.getData();
26                                     } else {
27                                         // 在表单中输出错误提示
28                                         let err = res.data.errors;
29                                         for (let key in err) {
30                                             err[key] = err[key][0];
31                                         }
32                                         that.formError = err;
33                                     }
34                                 })
35                                 .catch(err => {
36                                     that[_loading] = false; // button loading
37                                 });
38                         }
39                     }
40                 } else {
41                     that[_loading] = false;
42                     that.$message.error('请检查输入');
43                 }
44             });
45         }
原文地址:https://www.cnblogs.com/chenzeyongjsj/p/9958158.html