博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
element-ui 2.7.2版本使用 表格展开行 功能遇到的奇葩问题?
阅读量:5326 次
发布时间:2019-06-14

本文共 995 字,大约阅读时间需要 3 分钟。

在使用 element-ui 2.7.2版本的时候报下面的错误:

  [Vue warn]: Error in callback for watcher "data": "Error: if there's nested data, rowKey is required."

表面的意思是如果有嵌套的数据,需要在el-table标签中新增row-key字段。查阅文档element-ui 2.7.0 增加对树形结构数据的支持 ,而row-key是针对支持树类型的数据

而我需要的是展开行这个功能?

  已下面这个为例反复实现了几次:

    <el-table :data="tableData"></el-table>

  当tableData数据格式为以下形式时使用表格展开行功能,无任何问题

    tableData: [{

      name: '好滋好味鸡蛋仔',
      category: '江浙小吃、小吃零食',
      desc: '荷兰优质淡奶,奶香浓而不腻',
    }]

 

  当tableData数据格式为以下形式会出现上面的报错: 

    tableData: [{

      name: '好滋好味鸡蛋仔',
      category: '江浙小吃、小吃零食',
      desc: '荷兰优质淡奶,奶香浓而不腻',
      children:[{
        name:'土鸡蛋',
        desc:'美味...'
      }]
    }]

  问题就出现在key为children名字上,如果换成其他命名不会报错。。。。 

  如下可使用array.map函数处理下数据就可以解决问题了。。。

    let handleData = tableData.map(item => {

      return {
        name: item.name,
        category: item.category,
        desc: item.desc,
        childrens: item.children
      };
    });

    

  

  

 

转载于:https://www.cnblogs.com/changxue/p/10719454.html

你可能感兴趣的文章
剑指offer系列39:把字符串转换成整数
查看>>
cdoj1580 简单图论问题
查看>>
Logging 日志配置格式模板
查看>>
day4 liaoxuefeng---高级特性
查看>>
js,jq.事件代理(事件委托)复习。
查看>>
regular 点滴
查看>>
mysql中时间格式
查看>>
Hadoop介绍与安装
查看>>
redis 新开端口号
查看>>
fedora 21 安装 搜狗输入法
查看>>
Javascript获取url中的参数
查看>>
App对接支付宝移动支付功能
查看>>
Android Material Design 系列之 SnackBar详解
查看>>
浏览器端缓存的一个小问题及解决方案
查看>>
评论列表显示及排序,个人中心显示
查看>>
从git上拉下来的严选weex项目demo
查看>>
ios 字符串处理:截取字符串、匹配字符串、分隔字符串
查看>>
网络丢包严重的解决办法
查看>>
[Training Video - 5] [Groovy Script Test Step - Collections, Exceptions] Array and ArrayList
查看>>
iOS 黑屏
查看>>