zTree树状图怎么做回显？就是下次点击查看时会展示当前位置，不需要挨个查找

Question

目前做的效果，不会展示当前位置

但需求效果要这样，下次点击查看时能展示当前位置

<template>
<div class="select-tree">

<div id="menuContent" class="menuContent tree-box overflow-y">
  <ul id="treeDemo_i" class="ztree" style="margin-top:0; width:160px;"></ul>
</div>

</div>
</template>
<script>
import $ from 'jquery'
import '../../assets/js/tree'
export default {
name: 'selectTree',
props: {

// treeData: {
//   type: Array,
//   default: []this.$store.state.zNodes
// },
checkedId: {
  type: Number,
  default: ''
  
}

},
data() {

return {
  setting : {
    view: {
      dblClickExpand: false
    },
    data: {
      simpleData: {
        enable: true
      }
    },
    check: { 
      enable: true, 
      chkStyle: "radio",
      radioType: "all"
    }, 
    callback: {     
      onClick: this.onClick,
      // beforeCheck: zTreeBeforeCheck,
      // onAsyncSuccess: zTreeOnAsyncSuccessPublic
      // onCheck: this.ready,
    },
  },
};

},
mounted(){

this.$nextTick(() => {//创建下拉树
  // if(this.treeData[0].name != '选择下列选项'){
  //   this.treeData.unshift({name: '置为顶级菜单', pId: -1, id: -1})
  // }
  console.log(this.$store.state.zNodes)
  $.fn.zTree.init($("#treeDemo_i"), this.setting, this.$store.state.zNodes);
//   let nodes = ztree.getNodes();// 获取所有父节点
  var treeObj = $.fn.zTree.getZTreeObj("#treeDemo_i");
  var nodes = treeObj.getNodes(); 
  console.log(treeObj,nodes)
  // for (var i = 0; i < nodes.length; i++) { 
  //   // ztree.expandNode(nodes[i], true, false, true);//设置节点展开
  //   if(this.checkedId == nodes[i].id) {// 选中的条件
  //     debugger
  //     ztree.selectNode(nodes[i]);// 设置选中
  //     // ztree.setting.callback.onClick(null, ztree.setting.treeId, nodes[i]); //触发事件
  //   }
  // }
})

},
methods: {

onClick(e, treeId, treeNode) {//点击节点
  if(treeNode.level == 0)return
  this.$emit('hidden',treeNode);
  var zTree = $.fn.zTree.getZTreeObj("treeDemo_i");     
  zTree.checkNode(treeNode, !treeNode.checked, true, true); 

  // var name = '${weatherEleMap.crops_name}';
  // var nodes = zTree.transformToArray(zTree.getNodes());  
  // if (nodes.length>0) {
  //   for(var i = 0; i < nodes.length; i++){
  //     if(name.indexOf(nodes[i].name) >= 0){
  //       nodes[i].checked = true;
  //       zTree.updateNode(nodes[i]);
  //     }
  //   }
  // }
  return false;
},

// ajaxDataFilter(treeId, parentNode, responseData) {
//   var constructionUnit = $('#treeDemo_i').val()
//   // var zTree = $.fn.zTree.getZTreeObj("treeDemo_i"); 
//   if(constructionUnit){
//     if (responseData) {
//       for(var i = 0; i < responseData.length; i++) {
//         if(responseData[i].id == constructionUnit){
//           responseData[i].checked =true;
//         }
//       }
//     }
//     return responseData;
//   }
//   else{
//     return responseData;
//   }
// },

// zTreeOnAsyncSuccessPublic(event, treeId, treeNode, msg) {
//   var treeObj = $.fn.zTree.getZTreeObj(treeId);
//   // var zTree = $.fn.zTree.getZTreeObj("treeDemo_i");  
//   var node = treeObj.getNodeByParam("id", knowledgeId, null);
//   if(node!=null){
//   treeObj.checkNode(node, true, true);
//   }
// },

}
};
</script>
<style scoped>
.tree-box{

position: absolute;
z-index: 1;
background: #fff;
width: 100%;
border: 1px solid #3960AD;
box-sizing: border-box;
max-height: 380px;
z-index: 2;

}
</style>

Answer 1

先说下思路，加载树的时候用节点的tid使用数据表格中的id，当点击数据表格的查看时，根据表格中行的id通过ztree的查找节点API找到节点，再选中节点，参考一下。