vux 使用 loading 组件

1）声明引入Loading

import { Loading } from 'vux'

 

2）在模版底部添加 组件（需要添加到 template>div 标签里）

<template>
  <div>
    ……
    <loading v-model="showLoading" :text="loadText"></loading>
  </div>
</template>

 

3）通过控制 showLoading 变量 和 loadText 变量即可控制 Loading 组件

export default {
  components: {
    AjaxPlugin,
    Loading
  },
  data () {
    return {
      showLoading: false,
      loadText: 'Loading',
      articleList: this.getArticleList(1)
    }
  },
  methods: {
    getArticleList: function (catId) {
      let _this = this

      _this.showLoading = true

      htttpRequest('/api', {method: 'article.getList', 'catId': catId}, function (data) {
        _this.showLoading = false
        _this.articleList = data.Result.ArticleList
      })
      return []
    }
  }
}

 

---

完