tree好像没有直接获取节点DOM的方法，或者点击查看节点响应函数参数node其实只是一个传入data的数据对象.如果你拿不到DOM，那你就得好好想想了。获取方式如下：最近做了一个表单，希望能够查看一个二级下拉数据，于是想到了element的树组件，二级数据需要通过调用接口进行延迟加载和扩展。这种需求应该很多人都遇到过。树组件既支持复选框，也支持懒加载节点，功能足够了。所以起初我使用这样的组件：注意：我的显示数据是这样的：data=[{code:1,name:'One',children:[{code:11,name:'11'}]}]不过在编辑修改的时候遇到这个组件还是有点吃力的，虽然它支持默认勾选节点的属性配置了default-checked-keys，但是问题页面第一次加载这个组件的时候，一般来说我只加载一级数据，不加载二级数据，虽然只要checked-keys设置match,click第一层展开后，只要匹配到第二层，就会自动勾选，但显然这多出来的一步操作无疑不符合正常的交互流程，不是很好的体验nce，所以我们只能考虑更直观的操作，那就是能够默认在选中的一级数据下展开二级数据，勾选相关节点。expand-on-click-node一般支持点击节点除复选框以外的部分后展开子节点。现在需要优化的几点是：勾选未展开子节点的一级节点时，可以同时展开二级节点，勾选所有组件初始化显示data数据时，已勾选的二级节点可以展开该节点针对第一点。其实只需要解决勾选一级节点的问题，就可以触发子节点的扩容。全部勾选，组件已经实现了，不过上面我也提到了expand-on-click-node一般都支持取消勾选，点击checkbox之外的节点部分会触发展开。复选框只负责勾选功能，那么如何让它也触发展开呢？这时候需要使用@check-change响应，响应函数是这样写的：treeCheck(currentData,isCheck){//if(currentData.leaf)returnif(!currentData.children.length&&isCheck){//点击这个数据对应节点的展开图标constcurrentCode=currentData.codeconst$current=Array.from(this.$refs.dataTree.$children).filter($child=>{return$child.node.data.code===currentCode})[0]$current.$el.childNodes[0].childNodes[0].click()}}使用第二个参数isCheck来学习tickToselectanodeistoselectit,andthenodehasnochildren,可以作为基础未展开。这时候如果check-chage可以提供当前节点的dom或者能有扩展功能就好了，可惜没有。和同事交流的时候也说要修改源码。node.data只是与传入数据对象对应的数据。因此，可以通过数据遍历和过滤，一步步找到对应的dom。找到有展开箭头的icondom，手动点一下就解决了~是的，经过第一点经验获取nodedom和对应的展开icondom后，第二点好办，如default-checked-前面说的keys是告诉组件只要出现这些key就去check，所以第一点第二点的解决方案可以定位到解决扩展那些有checked子节点的一级节点的问题，然后通过获取对应的dom遍历和匹配数据，然后手动点击图标展开，剩下的加载操作，让组件来帮你完成和总结树的几个关键属性：数据：传入时作为一级节点数据initializationload：懒加载触发的函数，expand-on-clickwithlazy：点击节点触发子节点展开或折叠default-checked-keys：告诉组件检查select的key数组ednode默认check-change:节点选择状态改变时的回调show-checkbox:显示节点复选框ref:用于在找到树组件和dom时获取实例当组件api不够时，只要当您尝试完成功能时，当您需要使用dom时，您需要多加注意。
