用iview组件做一个后台管理系统,以下是使用过程遇到的问题,以及解决方法总结

问题1:iview的表单验证默认是string,当value值是number类型会报错

解决方法:将type值改为number

ruleValidate:{
        building: [
            { type: 'number', required: true, message: '必须选择数字', trigger: 'change' }
        ]
  }
问题2:树形结构组件渲染有问题

问题描述:项目中设置用户权限时用到树形组件,在用户列表中点击设置权限按钮弹出modal框,点击按钮的同时请求数据回来渲染树形结构,一般是第一次点击没问题,当点击其他用户的设置权限按钮渲染的树形结构就有问题

//树形组件
<Tree :data="curTreeData" show-checkbox ></Tree>

//js
data() {
   curTreeData = []; 
}
...
methods:{
    getTreeData: function () {
        getAllResources().then(res => {
          this.curTreeData = res.data;
        })
      }
}

解决方法:每次请求树形数据之前先将curTreeData初始化


...
methods:{
    getTreeData: function () {
        this.curTreeData = [];//初始化
        getAllResources().then(res => {
          this.curTreeData = res.data;
        })
      }
}
Logo

快速构建 Web 应用程序

更多推荐