欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue常見路由跳轉(zhuǎn)的幾種方式小結(jié)

 更新時(shí)間:2023年09月05日 09:01:46   作者:要加油哦~  
本文主要介紹了常見路由跳轉(zhuǎn)的幾種方式,主要介紹了四種常見方式,具有一定的參考價(jià)值,感興趣的可以了解一下

常見的路由跳轉(zhuǎn)有以下四種:

1. <router-link to="跳轉(zhuǎn)路徑"> 

/* 不帶參數(shù) */
<router-link :to="{name:'home'}">
<router-link :to="{path:'/home'}">
// 更建議用name
// router-link鏈接中,帶'/' 表示從根路徑開始,不帶 表示從當(dāng)前路由開始
/* 帶參 */
// 1. params傳參
<router-link :to="{name:'home', params: {id:1}}">
// 路由配置 用 path: "/home/:id" 或者 path: "/home:id"
// 配置path,刷新頁(yè)面參數(shù)保留;不配置path,刷新頁(yè)面后 參數(shù)會(huì)消失
// html 取參 $router.params.id
// script 取參 this.$router.params.id
// 2 query傳參
<router-link :to="{name:'home', query: {id:1}}">
// 路由可不配置
// html 取參 $router.query.id
// script 取參 this.$router.query.id

也可,如

2. this.$router.push() 跳轉(zhuǎn)到指定的url,并在history中添加記錄(即,點(diǎn)擊回退,會(huì)退回上一個(gè)頁(yè)面)。

/* 不傳參 或 query傳參 */
this.$router.push('/home')
this.$router.push({name:'home'})
this.$router.push({path:'/home'})
this.$router.push({name:'home', query: {id:'1'}})
this.$router.push({path:'/home', query: {id:'1'}})
/* params傳參 */
this.$router.push({name:'home', params: {id:'1'}})
this.$router.push({path:'/home', params: {id:'1'}})
//注: params傳參只能用name
//配置path,刷新頁(yè)面參數(shù)保留;不配置path,刷新參數(shù)消失
/* query和params的區(qū)別 */
// query類似于 get 請(qǐng)求,跳轉(zhuǎn)后頁(yè)面url會(huì)拼接參數(shù),如?id=1。-->適用于 非重要的參數(shù)
// params 類似于post,不拼接參數(shù),刷新頁(yè)面后參數(shù)消失。--->適用于 安全性較高的參數(shù),如密碼
 

html中,如:

3. this.$router.replace() 跳轉(zhuǎn)到指定的url, 但不會(huì)在history記錄(即,點(diǎn)擊回退 退回到上上個(gè)頁(yè))

4. this.$router.go(n) 向前或向后跳轉(zhuǎn) n 個(gè)頁(yè)面,n可正可負(fù)。 

使用后三種 需要在<script setup>中 導(dǎo)入

import router from '@/router';

參考:路由之間跳轉(zhuǎn)的方式_路由跳轉(zhuǎn)幾種方式_時(shí)間管理maste的博客-CSDN博客

路由跳轉(zhuǎn)幾種方法_路由跳轉(zhuǎn)的方式有哪幾種_丶凡人的博客-CSDN博客

到此這篇關(guān)于vue常見路由跳轉(zhuǎn)的幾種方式小結(jié)的文章就介紹到這了,更多相關(guān)vue路由跳轉(zhuǎn) 內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論