Elementui 导航组件和Vuejs路由结合

<template> <el-menu ?:default-active=\"$route.path\" ??????class=\"el-menu-vertical-demo\" ?????router=true ?????@open=\"handleOpen\" ?????@close=\"handleClose\" ?????background-color=\"#545c64\" ?????text-color=\"#fff\" ??????active-text-color=\"#ffd04b\" ?????v-bind:aa=\"$route.path\" > ?????<template ?v-for=\"item in menuDatas\"> ?????????<el-submenu ?v-if=\"item.children&&item.children.length>0\" v-bind:key=\"item.index\" v-bind:index=\"item.src\"> ?????????????<template slot=\"title\"> ???????????????<i class=\"el-icon-location\"></i> ??????????????????<span ?>{{ item.title }}</span> ?????????????</template> ?????????????<el-menu-item-group ?v-if=\"item.children&&item.children.length>0\" > ????????????????<el-menu-item ??v-for=\"item in item.children\" ?v-bind:key=\"item.index\" v-bind:index=\"item.src\" > ??????????????????<span >{{ item.title }}</span> ???????????????</el-menu-item> ??????????????</el-menu-item-group> ??????????</el-submenu> ?????????<el-menu-item ?v-else v-bind:key=\"item.index\" v-bind:index=\"item.src\"> ???????????<i class=\"el-icon-menu\"></i> ???????????<span ?>{{ item.title }}</span> ?????????</el-menu-item> ?????</template> ???????</el-menu> </template><script>export default { ?name: \"LeechgNav\", ?data: function() { ???var menuDatas = [ ?????{index:\"1\", type: \"href\", title: \"导航一\", icon: \"\", src: \"/1\", children: [ ???????{index:\"1-2\", ?type: \"href\", title: \"选项一\", icon: \"\", src: \"/index\", children: [] }, ???????{index:\"1-3\", ?type: \"href\", title: \"选项二\", icon: \"\", src: \"/lee\", children: [] }, ???????{index:\"1-4\", ?type: \"href\", title: \"选项三\", icon: \"\", src: \"/lee2\", children: [] } ?????] }, ?????{index:\"2\", ?type: \"href\", title: \"导航二\", icon: \"\", src: \"/2\", children: [] }, ?????{index:\"3\", ?type: \"href\", title: \"导航三\", icon: \"\", src: \"/3\", children: [] }, ?????{index:\"4\", ?type: \"href\", title: \"导航四\", icon: \"\", src: \"/4\", children: [] } ???]; ???return { ?????greeting: \"Hello\", ?????menuDatas ???}; ?}};</script><style>.leechg_index { ?background-color: red; ?color: white;}.el-row { ?margin-bottom: 20px;}.el-col { ?border-radius: 4px;}.bg-purple-dark { ?background: #99a9bf;}.bg-purple { ?background: #d3dce6;}.bg-purple-light { ?background: #e5e9f2;}.grid-content { ?border-radius: 4px; ?min-height: 36px;}.row-bg { ?padding: 10px 0; ?background-color: #f9fafc;}a{ ?color: white; ?text-decoration: none; ?color: inherit; ?text-decoration: inherit;}</style>