美文网首页
实践:自定义指令 - 局部loading

实践:自定义指令 - 局部loading

作者: 木头就是我呀 | 来源:发表于2020-05-23 17:27 被阅读0次

mt-loading

自定义指令 - 局部loading

npm仓库地址 : 自定义指令 - 局部loading

咋装下呢?

yarn add mt-loading 或者使用 npm i mt-loading

看下到底是个啥

mt-loading.gif

用起来!兄弟萌!

使用咋装下呢?中的命令将该插件安装到你的项目之后,就可以在main.js中使用import引入,然后使用Vue.use(XXX)使用即可。

import mtLoading from 'mt-loading'

Vue.use(mtLoading)

// 作为指令使用
<div v-mt-loading='true'></div>

参数都有啥

有三个状态
1. 默认(竖条纹loading)
<div v-mt-loading='true'></div>

2. 圆形loading
<div v-mt-loading.bounce='true'></div>

3. 竖条纹loading
<div v-mt-loading.move='true'></div>

修改默认颜色

例: 修改背景色
.mt-loading-bg-color{
  background-color: rgba(100,100,100,0.3) !important;
}

例: 修改icon颜色
.mt-loading-icon-color{
  background-color: red !important;
}

相关文章

网友评论

      本文标题:实践:自定义指令 - 局部loading

      本文链接:https://www.haomeiwen.com/subject/opjlahtx.html