如何通过Vue和jsmind实现思维导图的导航和快速定位功能？

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.js"></script><script src="https://cdn.jsdelivr.net/npm/jsmind@0.4.7/js/jsmind.js"></script>

<template>  <div ref="mindmap"></div></template><script>export default {  name: 'MindMap',  mounted() {    // 创建思维导图容器    const container = this.$refs.mindmap;    // 创建思维导图实例    const mindmap = new jsmind.mind({      container, // 容器      editable: true, // 是否可编辑    });    // 添加思维导图的节点    const rootNode = mindmap.addNode(null, '根节点', 'root');    const childNode1 = mindmap.addNode(rootNode, '子节点1', 'child1');    const childNode2 = mindmap.addNode(rootNode, '子节点2', 'child2');    // ...  },};</script>

<template>  <div>    <input type="text" v-model="nodeId" placeholder="请输入节点标识符">    <button @click="navigate">导航</button>  </div></template><script>export default {  name: 'MindMap',  data() {    return {      nodeId: '', // 节点标识符    };  },  methods: {    navigate() {      // 根据节点标识符查找节点      const node = mindmap.getNodeById(this.nodeId);      // 判断节点是否存在      if (node) {        // 高亮节点        mindmap.selectNode(node);      } else {        alert('节点不存在！');      }    },  },};</script>