Loading 全局加载

更新时间：2019/05/21 访问次数：1164

import { Loading } from 'genie-ui'
 
// 开始全局加载
Loading.open()
 
// 关闭全局加载
Loading.close()

也可以使用插件方式加载

Vue.use(Loading)
 
Vue.extend({
   methods: {
      xxx: {
          this.$loading.open()
      }
   }
})

Event

事件名称	说明	回调参数
open	(options)	打开全局 Loading 状态
close	无	关闭全局 Loading 状态

options 支持 text 和 duration 两个可选参数

text 加载时，提示的文案
duration 自动关闭全局 Loading 时间，默认值 0 表示不关闭

使用示例

<template>
  <div>
    <button @click="showLoading">点击显示 Loading</button>
  </div>
</template>
 
<script>
import { Loading } from 'genie-ui'
 
export default {
  components: {
  },
 
  methods: {
    showLoading (v) {
      console.log('opening')
      Loading.open({
        text: '加载中...', // 可选
        // NOTE: 可以使用 duration 定时关闭，也可以调用 close 手动关闭
        // duration: 5000
      })
 
      setTimeout(function () {
        console.log('closing')
        Loading.close()
      }, 5000)
    }
  }
}
</script>

FAQ

关于此文档暂时还没有FAQ

有用(0) 我要提问

天猫精灵IoT开放平台

Loading 全局加载

Event

使用示例

FAQ