vue.js如何引用vue router

vue.js引用vue router的方法：先安裝npm包，程式碼為【npm install vue-router --save】；然後利用【v-link】這個【directive】。

【相關文章推薦：#vue.js##】

vue.js引用vue router的方法：

安裝##基於傳統，我更喜歡採用npm包的形式進行安裝。

npm install vue-router --save

當然，官方採用了多種方式進行安裝，包括bower,cdn等。

基本用法

在HTML文件中使用，只需要利用

v-link

這個directive就行了，如：<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>&lt;a v-link=&quot;{path: &amp;#39;/view-a&amp;#39;}&quot;&gt;Go to view-a&lt;/a&gt;</pre><div class="contentsignin">登入後複製</div></div>ps:

v-link

也支援activeClass用於指定連結活躍時的css樣式。 replace屬性為true的時候可以讓連結在跳轉的時候不會留下歷史記錄。 而在ES5中使用，需要先建立路由器實例，然後傳入設定參數即可，如：

var router = new VueRouter();
router.map({
  '/view-a': {
    component: ViewA
  },
  '/view-b': {
    component: ViewB
  }
});
router.start(App, '#app');

以上定義的路由器規則，採用映射到一個元件的方式，最後啟動應用程式的時候，就掛載到#app的元素上。

相關免費學習推薦：

JavaScript

（影片）#

以上是vue.js如何引用vue router的詳細內容。更多資訊請關注PHP中文網其他相關文章！