之三 程式設計式路由

2021-09-07 14:29:58 字數 733 閱讀 9496

程式設計式路由，即通過寫js 函式，實現路由的跳轉。之前路由跳轉是通過router-link實現，本篇，我們通過函式來實現router-link 的跳轉功能。

舉例。首先是router／index.js **，如下。

import vue from 'vue'


import router from 'vue-router'


import goodlist from '@/views/goodlist'


import title from '@/views/title'


import image from '@/views/image'


import cart from '@/views/cart'


vue.use(router)


export default new router(, 


]}, 


]})
然後是cart.vue **如下。

購物車


}
最後是goodlist.vue **如下。

這是商品列表頁


}}顯示商品標題


顯示商品


跳轉到購物車


button - 跳轉到購物車
done!

程式設計式路由

什麼是程式設計式路由？通過js來實現頁面的跳轉 router.push name router.push router.push 或者 router.push router.go 1 例項 在商品列表頁面跳轉到購物車頁面 1 新建購物車頁面cart.vue 2 index.jsp中配置 引入元件 3...

程式設計式路由導航

message.vue template div ul li v for message,index in messages key message.id router link to home message detail message.id router link button click p...

路由程式設計式導航

想要導航到不同的 url，則使用 router.push 方法。這個方法會向 history 棧新增乙個新的記錄，所以，當使用者點選瀏覽器後退按鈕時，則回到之前的 url。宣告式 程式設計式 router.push 字串 router.push home 物件 router.push 命名的路由 r...