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"><a v-link="{path: &#39;/view-a&#39;}">Go to view-a</a></pre><div class="contentsignin">登入後複製</div></div>
ps:
也支援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中文網其他相關文章!