0
私のページにvuejsとvue routerを含め、ルータとvueを初期化するためにapp.js
を作成しましたが、ルーティングは機能しません。クライアントでvuejs2とvue-routerを稼働させることができません
// 0. If using a module system (e.g. via vue-cli), import Vue and VueRouter and then call `Vue.use(VueRouter)`.
// 1. Define route components.
// These can be imported from other files
const Foo = { template: '<div>foo</div>' }
const Bar = { template: '<div>bar</div>' }
// 2. Define some routes
// Each route should map to a component. The "component" can
// either be an actual component constructor created via
// `Vue.extend()`, or just a component options object.
// We'll talk about nested routes later.
const routes = [
{ path: '/foo', component: Foo },
{ path: '/bar', component: Bar }
]
// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
const router = new VueRouter({
routes // short for `routes: routes`
})
// 4. Create and mount the root instance.
// Make sure to inject the router with the router option to make the
// whole app router-aware.
const app = new Vue({
router: router
}).$mount('#app')
:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="../build/js/vue.min.js"></script>
<script src="../build/js/vue-router.min.js"></script>
<script src="../build/js/app.js"></script>
</head>
<body id="app">
<div class='nav'>
<router-link to="/foo">foo</router-link>
<router-link to="/bar">bar</router-link>
<router-link to="/tar">tar</router-link>
</div>
<div class="content">
<router-view></router-view>
</div>
</body>
</html>
マイapp.js
はちょうどこのVUE-ルータのページからのコピー/貼り付けまたはこのexampleで、これはコードの簡易版である<router-link to="/foo"> foo </router-link>
として内部定義されたリンクを参照してください。何らかの理由で
、私はリンクを全く見ることができません。コンソールにエラーは表示されません。すべてのファイルがページに正しく含まれています。
まだ働いていない、ここでのダンプがある私のindex.htmlを... HTTPSを見たい場合は働いた://ペーストビン.com/tuGUNYgP – hidar
あなたのvue.jsスクリプトは、閉じるボディータグの最後の前に来るべきです – Webber
これで、「テンプレートはUIに状態をマッピングする責任しか負いません。
私はそれはおそらくアプリidは は、スクリプトのリンクをチェック、divタグであるべきだと思います。
私はcodepenにしようと、それはあなたがそれhttps://codepen.io/ResoGuy/pen/Jyzjxg
出典
2017-09-03 00:49:08
の内部にあります。まだ動作していません。ここに、私のindex.htmlのダンプがあります。https://pastebin.com/tuGUNYgP – hidar