Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.1k views
in Technique[技术] by (71.8m points)

el-tree的props怎么用

正常的data结构

data: [
    {
      label: '一级 1',
      children: []
    }, 
    {
      label: '一级 2',
      children: []
    }, 
    {
      label: '一级 3',
      children: [
          {
            label: '二级 3-1',
            children: [
                {
                  label: '三级 3-1-1'
                }
            ]
          }
      ]
    }
],

<el-tree 
    :data="data" 
    :props="defaultProps" 
></el-tree>

defaultProps: {
  children: 'children',
  label: 'label'
}

我的data结构

mydata: [
    name:'啦啦啦',
    __config__:{
        label: '一级 0',
        children:[
            {
               name:'啊啊啊',
               __config__:{
                  label: '一级 1',
                  children: []
               }
            }, 
            {
               name:'呸呸呸',
               __config__:{
                  label: '一级 2',
                  children: []
               }
            }, 
            {
                name:'呱呱呱',
                __config__:{
                    label: '一级 3',
                    children: [
                        { 
                            name:'噢噢噢',
                            __config__:{
                                label: '二级 3-1',
                                children: [{
                                    label: '三级 3-1-1'
                                }]
                            }
                        }
                    ]
                }              
            }
        ]
    }    
],

其实就是多了一层__config__,我不想改变我的数据结构,于是用props

<el-tree
  :data="[mydata.__config__]"
  :props="layoutTreeProps"
>
layoutTreeProps: {
    label(data, node) {
      const config = data.__config__ || data
      return config.Name || config.label
    },
    children(data, node) {
      return data.children || data.__config__.children
    }
  }

这样倒是能把树渲染出来,可是会报错,
image.png

请问:
1、在不改变我的数据结构的情况下,怎么把tree渲染出来并且不报错呢?
2、为啥会出现上面的报错,怎么解决呢?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

你用的版本几,版本2之后children就不支持函数格式了,只支持string
image.png


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...