vue对提示框的封装

以你之姓@ 2022-11-29 13:13 160阅读 0赞

使用Modal Message 方法如下

const root = process.env.VUE_APP_URL;
    import axios from "axios";
    import { Modal,Message } from "view-design";
    
     deleteRow(url, ids) {
        return new Promise((resolve, reject) => {
          Modal.confirm({
            title: "删除提示",
            content: "确认删除当前数据吗？",
            loading: true,
            onOk: () => {
              axios
                .post(root + url, {
                  ids: ids,
                })
                .then((res) => {
                  Modal.remove();
                  resolve(res);
                })
                .catch((err) => {
                  Modal.remove();
                  Message.error('删除失败')
                  reject(err);
                });
            },
          });
        });
      },

LoadingBar 加载进度条

const root = process.env.VUE_APP_URL;
    import axios from "axios";
    import Vue from "vue";
    import ViewUI from 'view-design';
    Vue.use(ViewUI);
    
    filesUpload(files) {
        return new Promise((resolve, reject) => {
          ViewUI.LoadingBar.start();
          axios
            .post(root + "/files/upload", files, {
              headers: {
                "Content-Type": "multipart/form-data;",
              },
            })
            .then((res) => {
              ViewUI.LoadingBar.finish();
              resolve(res);
            })
            .catch((err) => {
              ViewUI.LoadingBar.finish();
              Message.error('上传失败')
              reject(err);
            });
        });
    
    ``

发表评论取消回复

表情：

评论列表（有 0 条评论，160人围观）

还没有评论，来说两句吧...

相关阅读

相关前端(vue)提示框显示不全

问题效果如下： ![405e5327a8d642a2b8fc44459cc52e78.png][] 解决过程：最开始以为是提示被挡住了，于是查看了下元素（如下图操作），发现

你的名字/ 2024年03月16日 19:04/ 0 赞/ 91 阅读

相关 vue中 input输入框的封装

在vue中会将常用的组件进行封装，如下是input输入框的一个封装。 <template> <div class="text_group">

﹏ヽ暗。殇╰゛Y/ 2023年02月17日 06:24/ 0 赞/ 123 阅读

相关 vue对提示框的封装

使用Modal Message 方法如下 const root = process.env.VUE_APP_URL; import axios from "a

以你之姓@/ 2022年11月29日 13:13/ 0 赞/ 161 阅读

相关 vue封装复选框组件

前言 > 根据[百度前端技术学院2018 MVVM 学院][2018 MVVM] 中的[ 2.5 表单实现Input、Checkbox组件][2.5 _Input_Che

╰+攻爆jí腚メ/ 2022年01月31日 15:27/ 0 赞/ 808 阅读

相关 vue-项目对axios进行封装

需求描述我们在做vue项目的时候，经常会遇到一个问题就是我们的请求需要加请求头，或者还不是一个请求头的情况，那么其实我们可以使用比较原始的办法，直接在我们写的时候就直接

你的名字/ 2021年11月11日 16:16/ 0 赞/ 333 阅读

相关 vue - 搜索框组件的封装及使用

在写一个项目的时候，我们在多个页面会使用到搜索功能，这时我们一般都会选择直接写一个组件给多个页面一起使用，下面我给大家分享一下我的组件封装，如果不妥之处，请多多指教！

青旅半醒/ 2021年09月30日 14:22/ 0 赞/ 1078 阅读

相关消息框-提示框

今天找到一个非常简单的提示消息弹出框直接上代码 html ![1500786-20181012154016519-1839245572.png][] css

迷南。/ 2021年09月29日 23:38/ 0 赞/ 471 阅读

相关 vue + element-input封装数字框

因业务需要，要求一个数字框，现有的element的input不太符合要求，遂动手封装了一个，封装后仍能调用原<el-input>事件。功能：仅能输入合法整数和小数格式，默认

川长思鸟来/ 2021年09月25日 02:34/ 0 赞/ 253 阅读

相关 vue -提示框组件的封装

1、效果图： ![在这里插入图片描述][20190902153727819.png] 2、子组件的封装 <template> <div cla

旧城等待，/ 2021年08月13日 22:50/ 0 赞/ 540 阅读

相关继续对dwz封装树形下拉框

前言：之前写了一篇dwz的树形下拉框组件，只能满足单页面的使用，但是面对实际应用时，以上应用暂时不能满足，于是乎又重新对树形菜单进行改造。 ![74473faa-e315-

系统管理员/ 2021年05月10日 11:18/ 0 赞/ 455 阅读