Vue3如何獲取來源路由
更新時(shí)間：2024年07月02日 11:08:47 作者：gaolei_eit
這篇文章主要介紹了Vue3如何獲取來源路由問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
Vue3獲取來源路由
//路由 兩個(gè)必須是同級(jí)路由
{
path: "/room",
name: "Room",
component: () => import("@/views/Room/index.vue"),
meta: {
title: "房間"
},
beforeEnter: (to, from, next) => {
const name = from.name as string;
if (["RoomHistory", "Room"].includes(name)) {
to.params.from = "RoomHistory";
} else {
to.params.from = "other";
}
next();
}
},
//頁面
console.log(route.params.from, "route.params.from");Vue3獲取當(dāng)前路由參數(shù)
<script>
import {useRouter, useRoute} from 'vue-router'
export default {
setup(){
// 獲取路由器實(shí)例
const router = useRouter()
//使用
//router.push..... 等等方法
// route響應(yīng)式對(duì)象，監(jiān)控變化，傳值
const route = useRoute
//獲取 處理route.query 等等
}
}
</script>Vue3獲取所有路由
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
console.log(router.getRoutes());總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue函數(shù)input輸入值請(qǐng)求時(shí)延遲1.5秒請(qǐng)求問題
這篇文章主要介紹了vue函數(shù)input輸入值請(qǐng)求時(shí)延遲1.5秒請(qǐng)求問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-04-04
vue的index.html中獲取環(huán)境變量和業(yè)務(wù)判斷圖文詳解
這篇文章主要給大家介紹了關(guān)于vue的index.html中獲取環(huán)境變量和業(yè)務(wù)判斷的相關(guān)資料,對(duì)vue來說index.html是一個(gè)總的入口文件,vue是單頁面應(yīng)用,掛在id為app的div下然后動(dòng)態(tài)渲染路由模板,需要的朋友可以參考下2023-09-09
Vue?Router?是?Vue?的官方路由，它與?Vue.js?核心深度集成，讓用?Vue.js?構(gòu)建單頁應(yīng)用變得輕而易舉，本文將通過簡單的示例為大家介紹一下vue-router的使用，需要的可以參考一下2023-06-06
這篇文章主要介紹了Vue選取本地圖片，自定義裁切圖片比例?vue-cropper,本文分步驟結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-07-07
前端在el-dialog中嵌套多個(gè)el-dialog代碼實(shí)現(xiàn)
最近使用vue+elementUI做項(xiàng)目,使用過程中很多地方會(huì)用到dialog這個(gè)組件,有好幾個(gè)地方用到了dialog的嵌套,下面這篇文章主要給大家介紹了關(guān)于前端在el-dialog中嵌套多個(gè)el-dialog代碼實(shí)現(xiàn)的相關(guān)資料,需要的朋友可以參考下2024-01-01
elementui源碼學(xué)習(xí)之仿寫一個(gè)el-divider組件
這篇文章主要為大家介紹了elementui源碼學(xué)習(xí)之仿寫一個(gè)el-divider組件示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要介紹了vscode下的vue文件格式化問題，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-11-11
Element plus實(shí)現(xiàn)圖片手動(dòng)上傳與回顯的過程
近期,發(fā)現(xiàn)點(diǎn)擊修改,element ui 的圖片沒有回顯到框中,所以本文給大家介紹了Element plus實(shí)現(xiàn)圖片手動(dòng)上傳與回顯的過程,文中通過代碼示例給大家介紹的非常詳細(xì),具有一定的參考價(jià)值,需要的朋友可以參考下2024-09-09
vue+render+jsx實(shí)現(xiàn)可編輯動(dòng)態(tài)多級(jí)表頭table的實(shí)例代碼
這篇文章主要介紹了vue+render+jsx實(shí)現(xiàn)可編輯動(dòng)態(tài)多級(jí)表頭table的實(shí)例代碼，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的工作或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-04-04
vue3(vite)設(shè)置代理封裝axios api解耦功能
這篇文章主要介紹了vue3（vite）設(shè)置代理封裝axios api解耦,本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12