vue2.0項(xiàng)目實(shí)現(xiàn)路由跳轉(zhuǎn)的方法詳解
一、安裝
1、安裝路由vue-router:
npm install vue-router
vue項(xiàng)目的依賴(lài)文件node_modules存在vue-router依賴(lài)，說(shuō)明安裝成功
2、vue項(xiàng)目引入vue-ruoter：
二、應(yīng)用
1、路徑配置（頁(yè)面跳轉(zhuǎn)）：
方法一：如果切換的頁(yè)面不多，可以直接在main.js文件內(nèi)配置。
方法二：如果切換的頁(yè)面較多，可以建一個(gè)專(zhuān)門(mén)用于路由的js文件，里面配置路徑。
1）router.js配置文件
2）main.js里引入router.js路由文件
2、組件里調(diào)用
1）使用router-view標(biāo)簽給vue組件的跳轉(zhuǎn)提供一個(gè)容器
2）使用router-link標(biāo)簽實(shí)現(xiàn)跳轉(zhuǎn)（它類(lèi)似于a標(biāo)簽，區(qū)別在于router-link跳轉(zhuǎn)不需要刷新頁(yè)面）
跳轉(zhuǎn)至table組件：
3、實(shí)現(xiàn)效果
項(xiàng)目的首頁(yè)：
點(diǎn)擊table后跳轉(zhuǎn)：
總結(jié)
以上所述是小編給大家介紹的vue2.0項(xiàng)目實(shí)現(xiàn)路由跳轉(zhuǎn)的方法詳解，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家介紹了LogicFlow內(nèi)置插件使用實(shí)例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
vue2 前后端分離項(xiàng)目ajax跨域session問(wèn)題解決方法
本篇文章主要介紹了vue2 前后端分離項(xiàng)目ajax跨域session問(wèn)題解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04
Vue全局監(jiān)測(cè)錯(cuò)誤并生成錯(cuò)誤日志實(shí)現(xiàn)方法介紹
在做完一個(gè)項(xiàng)目后，之后的維護(hù)尤為重要。這時(shí)，如果項(xiàng)目配置了錯(cuò)誤日志記錄，這樣能大大減少維護(hù)難度。雖然不一定能捕獲到全部的錯(cuò)誤，但是一般的錯(cuò)誤還是可以監(jiān)測(cè)到的。這樣就不用測(cè)試人員去一遍一遍復(fù)現(xiàn)bug了2022-10-10
關(guān)于vue中根據(jù)用戶權(quán)限動(dòng)態(tài)添加路由的問(wèn)題
每次路由發(fā)生變化時(shí)都需要調(diào)用一次路由守衛(wèi)，并且store中的數(shù)據(jù)會(huì)在每次刷新的時(shí)候清空，因此需要判斷store中是否有添加的動(dòng)態(tài)路由，本文給大家分享vue中根據(jù)用戶權(quán)限動(dòng)態(tài)添加路由的問(wèn)題，感興趣的朋友一起看看吧2021-11-11
本篇文章主要介紹了詳解VUE2.X過(guò)濾器的使用方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-01
vue雙向錨點(diǎn)實(shí)現(xiàn)過(guò)程簡(jiǎn)易版(scrollIntoView)
這篇文章主要介紹了vue雙向錨點(diǎn)實(shí)現(xiàn)過(guò)程簡(jiǎn)易版(scrollIntoView),具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07
在vue中實(shí)現(xiàn)禁止屏幕滾動(dòng),禁止屏幕滑動(dòng)
這篇文章主要介紹了在vue中實(shí)現(xiàn)禁止屏幕滾動(dòng),禁止屏幕滑動(dòng)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-07-07
vue項(xiàng)目中向數(shù)組添加元素的3種方式
這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目中向數(shù)組添加元素的3種方式,在Vue中添加元素到數(shù)組非常簡(jiǎn)單,文中通過(guò)代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-10-10
vue搜索頁(yè)開(kāi)發(fā)實(shí)例代碼詳解（熱門(mén)搜索，歷史搜索，淘寶接口演示）
這篇文章主要介紹了vue搜索頁(yè)開(kāi)發(fā)實(shí)例（熱門(mén)搜索，歷史搜索，淘寶接口演示）,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-04-04
Vue狀態(tài)管理庫(kù)Pinia詳細(xì)介紹
這篇文章主要介紹了Vue3-pinia狀態(tài)管理,pinia是 vue3 新的狀態(tài)管理工具，簡(jiǎn)單來(lái)說(shuō)相當(dāng)于之前 vuex，它去掉了 Mutations 但是也是支持 vue2 的，需要的朋友可以參考下2022-08-08