zoukankan      html  css  js  c++  java
  • ElementUI树形表格默认展开

    ElementUI树形表格默认展开,通过expand-row-keys设置默认展开行。

    我们在使用element的Table表格来编写树形表格时,官方提示需要除了正常配置外 row-key 树形是必须的

    image-20200911155311873

    官方给的例子

    image-20200911155437699

    配置了上面的这个属性后我们就可以使用 expand-row-keys 来配置默认展开的key

    image-20200911155626945

    对应 expand-row-keys 的配置,官方也没有给出例子,于是我就自己配置了一下

    <el-table
        ref="table"
        v-loading="listLoading"
        element-loading-text="数据拼命加载中"
        highlight-current-row
        row-key="id"
        style=" 100%;margin-bottom: 20px;"
        :data="tableData"
              
        :expand-row-keys="[1,2,3]"
              
        :tree-props="{children: 'children', hasChildren: 'hasChildren0'}"
        @row-dblclick="handleRowDbClick"
        @expand-change="handleExpandChange"
    >
    

    然后发现并没有作用。

    说下我为什么会这样设置,

    因为数据的记录id是数字,所以在设置时我就理所应当的设置了对应记录的id进去。

    然后就一度怀疑人生,最后我改成这样就可了

    <el-table
        ref="table"
        v-loading="listLoading"
        element-loading-text="数据拼命加载中"
        highlight-current-row
        row-key="id"
        style=" 100%;margin-bottom: 20px;"
        :data="tableData"
              
        :expand-row-keys="['1','2','3']"
              
        :tree-props="{children: 'children', hasChildren: 'hasChildren0'}"
        @row-dblclick="handleRowDbClick"
        @expand-change="handleExpandChange"
    >
    

    把数组里面的元素改成字符串就可以了 ???

  • 相关阅读:
    Python元组、列表、字典
    测试通过Word直接发布博文
    Python环境搭建(windows)
    hdu 4003 Find Metal Mineral 树形DP
    poj 1986 Distance Queries LCA
    poj 1470 Closest Common Ancestors LCA
    poj 1330 Nearest Common Ancestors LCA
    hdu 3046 Pleasant sheep and big big wolf 最小割
    poj 3281 Dining 最大流
    zoj 2760 How Many Shortest Path 最大流
  • 原文地址:https://www.cnblogs.com/lixingwu/p/13652310.html
Copyright © 2011-2022 走看看