loading 安装vue-loading-overlay

使用npm安装vue-loading-overlay

npm install vue-loading-overlay --save

在main.js文件中配置

import Vue from 'vue'
import App from './App.vue'
import router from './router.js'
import Loading from 'vue-loading-overlay'
import 'vue-loading-overlay/dist/vue-loading.css'

Vue.use(Loading);

Vue.config.productionTip = false
new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

使用

<template>
  <div>
   <button @click="showLoading">显示loading</button>
  </div>
</template>
<script>
 import browser from '../utils/browserEnvironment.js'
 export default {
  methods: {
   showLoading(){
      let loader = this.$loading.show()
     // let loader = this.$loading.show({
     //   opacity: 1.0,
     //   color: '#ffffff',
     //   backgroundColor: '#19243A'
     // })
      setTimeout(() => {
        loader.hide()
      }, 3000);
    }
  }
 }  
</script>
   

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。