vue项目中使用mint-ui添加loading

灰太狼 2022-03-10 15:54 301阅读 0赞

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70][]

如图，在vue项目中使用mint-ui添加loading图标

## **方法：** ##

1.下载

npm install mint-ui -S

2.在 main.js  引入样式

import 'mint-ui/lib/style.css';

![20190311153950916.png][]

3.在需要vue组件中引入

import { Indicator } from 'mint-ui';

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 1][]

调用

Indicator.open({
        	text: '加载中...',
          //文字
        	spinnerType: 'fading-circle',
          //样式
        });

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 2][]

关闭

Indicator.close();

如有不足，欢迎下方补充

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70]: /images/20220310/c855eb445774429f9b5fd66d00d2a89a.png
[20190311153950916.png]: /images/20220310/e11bddd5a6444480804af1540285c127.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 1]: /images/20220310/f2cc2ff1350e4ad5a924e33ea868dc4a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 2]: /images/20220310/c02de46fd3bf4b828fe9dc880e3c9b42.png

发表评论取消回复

表情：

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

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

相关阅读

相关 Vue中mintui的field实现blur和focus事件

[https://blog.csdn.net/ywl570717586/article/details/80535236][https_blog.csdn.net_ywl570

比眉伴天荒/ 2023年02月22日 08:27/ 0 赞/ 22 阅读

相关 vue项目中使用vue-router

说明 > 此处仅做简单记录，并没有做详细的整理。操作步骤 1、通过以下命令安装路由，如下： npm install vue-router --s

小鱼儿/ 2023年01月13日 05:58/ 0 赞/ 360 阅读

相关 vue项目中添加cnzz统计

在App.vue中添加： export default { name: 'App', mounted() { //

「爱情、让人受尽委屈。」/ 2023年01月06日 13:00/ 0 赞/ 109 阅读

相关 vue项目添加stylelint

使用vue cli3.x创建一个初始项目代码风格: eslint + prettier 项目中添加stylelint进行css代码规范安装 cnpm i s

秒速五厘米/ 2022年12月04日 15:57/ 0 赞/ 319 阅读

相关 vue 项目中添加水印效果

在项目中有给部分区域或者是整个页面添加水印的需求。加水印其实很简单，它的原理是使用 canvas 生成图片在使用 toDataURL 转化为 base64 格式，然后将转换后的

今天药忘吃喽~/ 2022年11月02日 11:47/ 0 赞/ 575 阅读

相关 vue项目水印添加

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

川长思鸟来/ 2022年09月03日 04:29/ 0 赞/ 295 阅读

相关 vue移动appUI框架搭建-选取mintUI

搭建了一下mintUI，使用时vue2.0 ，mintUI本身挺好用的，但是很久没人维护了，所有仅仅搭建了UI。后来又用vue3.0，选取vantUI搭建了一套移动app

迈不过友情╰/ 2022年03月12日 05:23/ 0 赞/ 381 阅读

相关 vue项目中使用mint-ui添加loading

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9f

灰太狼/ 2022年03月10日 15:54/ 0 赞/ 302 阅读

相关 vue项目添加Jquery

vue-cli怎么引入jquery Posted on [2016年8月24日][2016_8_24] By [618插件网][618] 1.npm install

骑猪看日落/ 2021年10月09日 03:32/ 0 赞/ 361 阅读

相关 vue 中封装loading

全局注册 Vue.prototype.myLoading = function () { const loading = this.$loading({

桃扇骨/ 2021年07月26日 02:56/ 0 赞/ 433 阅读