vue.js - vux loading出现的问题

问题描述

问 题

第一个问题：
在vux官网中，描述了引用组件的两种方式：

// 不推荐的方式，会打包所有vux模块
import { Group, Cell } from 'vux'

// 推荐的方式，按需加载需要的组件
import Group from 'vux/dist/components/group'
import Cell from 'vux/dist/components/cell'

我使用第二种方式无法引用组件，组件打印出来是undefined，换成第一种方式没问题，但官网不推荐。大家能不能给个建议，为什么第二种方式不生效，我确定路径是没问题的。

---

第二个问题：

<loading></loading>
import { Loading } from 'vux'
module.exports = {
    components: {
        Loading
    }
}

如此引用之后，在浏览器中看，div内有display:none样式，不知道为什么？

在浏览器中将display:none去除后，loading框展示，

用过vux的人能不能帮我解个惑，vue新手谢谢大家！

解决方案

1.两种引入方式都可以，第一种是引入全部的组件（体积比较大），第二种是只引入需要的组件，打包后体积小，你贴代码，才能确定哪里错误了（1.检查路径，2.不要写成了import {Group} from ....）
2.Loading 组件需要传递prop显示，Loading.vue 源码：

export default {
  props: {
    show: Boolean,
    text: {
      type: String,
      default: 'Loading'
    },
    position: String
  }
}

show的值，默认为false,所以你在使用的时候需要使用

<loading :show="true"></loading> 。

或者：

<loading :show="isShow"></loading>

import { Loading } from 'vux'
module.exports = {
    data:function(){
        return {
            isShow:true
        }
    },
    components: {
        Loading
    }
}

这篇关于vue.js - vux loading出现的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！