elementui tree树形控件 default-expanded-keys失效及动态绑定问题

elementui 中的树想要默认展开官方文档中有介绍：

1.默认展开失效问题

https://element.eleme.cn/#/zh-CN/component/tree

 

<el-tree
  :data="data"
  show-checkbox
  node-key="id"
  :default-expanded-keys="[2, 3]"
  :default-checked-keys="[5]"
  :props="defaultProps">
</el-tree>

也就是说要指定node-key为你数据中的唯一标识id，并且加入:default-checked-keys="[5]"属性，数组中的内容就是你指定的id的值，但我发现返回的id是字符串类型的，所以只写数字的话不生效  [1000,2000]

改成字符串id就好了： 

:default-checked-keys="['1000','2000']"

2.动态绑定默认展开问题

我的树形是动态的，但我只想默认展开第一个，则只能动态绑定第一个的id了

<el-tree :data="treeData" :props="defaultProps" 
					@node-click="handleNodeClick"
					:render-content="renderContent1"
					node-key="offerSvcCode"
					accordion
					:default-expanded-keys="defaultExpandKeys"
					highlight-current
				></el-tree>

让default-checked-keys为我data中设置的值

defaultExpandKeys: [],

在加载树形数据时将第一个id赋值给defaultExpandKeys

loadTreeData(){
		
				let self=this;
				this.axios.get('iop/newmarketingmanage/getMarketingOfferMapCodeTree')
				.then(function (response) {
					var data =eval('(' + response.data + ')')
					if(data.resultCode==0){
						self.treeData=data.resultData
						self.addDisabledLable(self.treeData)
						
						self.defaultExpandKeys=[data.resultData[0].offerSvcCode]
					}

				})
				.catch(function (error) {
				  //console.log(error)
				  self.$Message.error('请求失败')
				  self.isLoading = false
				})
			},

这样就可以每次默认展开第一个。

 

还有就是每次操作树数据更新问题，想要保持展开的父类状态：

这样加一个点击事件，每次把点击的id保存即可

<el-tree
				:data="treeData"
				node-key="offerSvcCode"
				:render-content="renderContent"
				:props="defaultProps"
				@node-click="handleNodeClick2"
				ref="tree"
				accordion
				:default-expanded-keys="defaultExpandKeys1"
				highlight-current
			>
			</el-tree>

 

handleNodeClick2(nodes,node,self){
				this.defaultExpandKeys1=[node.data.offerSvcCode];
			},