import Vue from 'vue' import one from './one.vue' Vue.config.productionTip = false /* eslint-disable no-new */ new Vue({ el: '#one', render: h => h(one) }) one.vue写法如下： <template> <div> {{msg}} </div> </template> <script> export default { name: 'one', data () { return { msg: 'I am one' } } } </script>
two的写法与之类似，所以不写下来了，
然后App.vue里通过这样写：
<template> <div> <a href="https://www.jb51.net/one.html" >one</a><br> <a href="https://www.jb51.net/two.html" >two</a><br> {{msg}} </div> </template>
这样子当你打开页面的时候，点击上面one的链接就会跳转到one.html，点击two就跳转到two.html。这样子就大功告成了。