仅使用 script 标签在 Vue2 中设置 Vue 路由器。类似于 Angular 1.x 路由器

Question

仅使用 script 标签在 Vue2 中设置 Vue 路由器。类似于 Angular 1.x 路由器

我需要在我的 vue ja 2 应用程序中设置 vue 路由器。我没有使用 vue cli，只是使用 vue Js 的 cdn。我无法找到如何使用 cdn 设置 vue 路由器的方法。任何人都可以建议任何文档或者如何实现这一点的技术？任何帮助将非常感激

Answer 1

Mar*_*yer 5

这是一个简单的示例，可以帮助您开始：

<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>

Run Code Online (Sandbox Code Playgroud)

归档时间：	8 年，3 月前
查看次数：	783 次
最近记录：	8 年，3 月前