更新记录

1.0.6(2020-09-01)

修复布局异常

1.0.5(2020-09-01)

底层组件wyb-popup更新

查看更多

平台兼容性

一、使用说明

  1. 解压下载的压缩包,将组件放在项目的components目录下

  2. 引用组件

    <wyb-loading ref="loading"/>
    import wybLoading from '@/components/wyb-loading/wyb-loading.vue'
    export default {
        components: {
            wybLoading
        }
    }
    this.$refs.loading.showLoading() // 显示
    this.$refs.loading.hideLoading() // 隐藏
  3. Demo体验地址:点我访问(请用手机访问,或用桌面浏览器启动手机调试模式)

  4. 如果觉得我的插件还不错,可以下载我的插件的示例集合Demo => 传送门,里面有我全部的插件以及全部插件的示例工程

二、参数说明

  1. Props

    参数名 类型 默认值 说明 可选值
    title String '请稍后' loading提示文字
    type String 'square' loading框类型 square | rectangle
    loading-type String 'ring' loading动画 ring | fade-ball | scale-line | flower
    radius String, Number '8' loading框圆角值
    z-index String, Number '10076' 同css
    mask-alpha Number 0.2 遮罩透明度
    animation String 'fade' loading框的动画类型 fade | slide-down | slide-up | zoom-lessen
    bg-color HexColor, RgbColor '#494949' loading框背景色
    ft-color HexColor '#fff' loading框前景色( 不可使用rgb()与rgba() )
    duration Number 250 动画演出时间
    hide-delay Number 50 隐藏延时,防止数据加载过快,组件没渲染完就执行了hide()方法,而导致报错
    negative-top Number 0 加载框向上的偏移量
  2. Events

    事件名 说明
    @show loading框显示后触发
    @hide loading框隐藏后触发

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问