添加树形拓扑图

Author: Jason-chen-coder

package-lock.json

@@ -10,8 +10,13 @@
   "dependencies": {
     "core-js": "^3.6.5",
     "d3": "^5.16.0",
+    "dagre-d3": "^0.6.4",
     "element-ui": "^2.13.2",
-    "vue": "^2.6.11"
+    "jquery": "^3.5.1",
+    "less-loader": "^6.1.0",
+    "vfd": "^1.0.5",
+    "vue": "^2.6.11",
+    "vue-router": "^3.3.2"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.4.0",

package.json

@@ -1,17 +1,28 @@
 <template>
   <div id="app">
-    <topo-index msg="Welcome to Your Vue.js App" />
+    <button>
+      <h1>
+        <router-link class="links" to="topoindex">topo</router-link>
+      </h1>
+    </button>
+    &nbsp;
+    <button>
+      <h1>
+        <router-link class="links" to="treetopo">treetopo</router-link>
+      </h1>
+    </button>
+
+    <br />
+    <br />
+    <br />
+    <router-view></router-view>
   </div>
 </template>
 
 <script>
-import TopoIndex from './components/topoindex'
 
 export default {
-  name: 'App',
-  components: {
-    TopoIndex
-  }
+  name: 'App'
 }
 </script>
 
@@ -24,4 +35,11 @@ export default {
   color: #2c3e50;
   margin-top: 60px;
 }
+.links {
+  text-decoration: none;
+  padding: 20px;
+}
+button {
+  margin: 0 40px;
+}
 </style>