美文网首页
loading 安装vue-loading-overlay

loading 安装vue-loading-overlay

作者: xiesen | 来源:发表于2019-07-12 16:10 被阅读0次

使用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>
   

相关文章

网友评论

      本文标题:loading 安装vue-loading-overlay

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