使用脚本标签 only.like angular 1.x 路由器在 Vue2 中设置 Vue 路由器

Question

我需要在我的 vue ja 2 应用程序中设置 vue 路由器。我没有使用 vue cli 只是 vue Js 的 cdn。我无法找到如何使用 [= 设置 vue 路由器的方法15=] 有人建议任何文档或如何实现该目标的技术吗？任何帮助将不胜感激

Answer 1

这里有一个简单的例子可以帮助你开始：

<html>
<head>
    <script src="https://unpkg.com/vue"></script>
    <script src="https://unpkg.com/vue-router@2.0.0/dist/vue-router.js"></script>
</head>
<body>
<div id="app">
    <p><router-link to="/page1">Go to Page 1</router-link></p>
    <p><router-link to="/page2">Go to Page 2</router-link></p>
    <p><router-view></router-view></p>
</div>

<script>
    var PageTwoComponent = Vue.component('comp2',{
        template: '<p>Component Two</p>'
    })
    var PageOneComponent = Vue.component('comp1',{
        template: '<p>Component One</p>'
    })

    const routes = [
        {path: '/page1', component: PageTwoComponent},
        {path: '/page2', component: PageOneComponent}
    ]

    const router = new VueRouter({
        routes
    })

    var app = new Vue({
        router
    }).$mount('#app')

</script>
</body>
</html>

使用脚本标签 only.like angular 1.x 路由器在 Vue2 中设置 Vue 路由器

Setting up Vue router in Vue2 using the script tag only.like angular 1.x router

vue-router

vuejs2