iview组件使用总结

最新推荐文章于 2020-11-04 19:40:17 发布

風缘

最新推荐文章于 2020-11-04 19:40:17 发布

阅读量2.1w

点赞数

分类专栏： vue 文章标签： vue iview

本文链接：https://blog.csdn.net/liangrongliu1991/article/details/78343295

版权

vue 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

用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;
        })
      }
}