快捷導(dǎo)航

vue3 setup點(diǎn)擊跳轉(zhuǎn)頁面的實(shí)現(xiàn)示例

更新時(shí)間：2023年10月26日 10:07:36 作者：ZYJ~

本文主要介紹了vue3 setup點(diǎn)擊跳轉(zhuǎn)頁面的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

1、push跳轉(zhuǎn)

1.1、params傳參，動(dòng)態(tài)傳參，數(shù)據(jù)會(huì)顯示在地址欄中，且刷新頁面不會(huì)消失

router.push({
    name: "MarineSpecialAddOrUpdate", //跳轉(zhuǎn)的組件名字
    params: { //參數(shù)
      id: id,
      activeNames: "composition"
    }
  })

1.2、query傳參，傳遞的參數(shù)會(huì)顯示在地址欄中

router.push({
    path: "/business/marineSpecialAddOrUpdate",//跳轉(zhuǎn)的路徑
    query: { //參數(shù)
      id: id,
      activeNames: "composition"
    }
  })

2、點(diǎn)擊跳轉(zhuǎn)后打開一個(gè)新窗口

  const {href} =  router.resolve({
    name:'MarineSpecialAddOrUpdate',//跳轉(zhuǎn)的組件名字
    params: {
      id: id,
    },
  });
  window.open(href, "_blank");

  const {href} =  router.resolve({
    path:'/business/MarineSpecialAddOrUpdate',//跳轉(zhuǎn)路徑
    query: {
      id: id,
    },
  });
  window.open(href, "_blank");

到此這篇關(guān)于vue3 setup點(diǎn)擊跳轉(zhuǎn)頁面的實(shí)現(xiàn)示例的文章就介紹到這了,更多相關(guān)vue3 setup點(diǎn)擊跳轉(zhuǎn)頁面內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

Vue實(shí)現(xiàn)滑動(dòng)驗(yàn)證功能
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)滑動(dòng)驗(yàn)證功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-02-02
使用Vue實(shí)現(xiàn)網(wǎng)頁截圖和截屏功能
網(wǎng)頁截圖與截屏功能在許多Web應(yīng)用程序中都非常有用,Vue.js作為一個(gè)流行的JavaScript框架,提供了許多工具和庫來簡化網(wǎng)頁截圖和截屏的實(shí)現(xiàn),本文將介紹如何使用Vue來實(shí)現(xiàn)一個(gè)網(wǎng)頁截圖和截屏功能的示例,包括使用html2canvas庫和vue-cropper庫,需要的朋友可以參考下
2023-10-10
vue如何實(shí)現(xiàn)在線編輯excel
這篇文章主要介紹了vue如何實(shí)現(xiàn)在線編輯excel問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-10-10
詳解Vue router路由
這篇文章主要為大家介紹了Vue 的router路由，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
2021-11-11
vue使用elementui的el-menu的折疊菜單collapse示例詳解
這篇文章主要介紹了vue使用elementui的el-menu的折疊菜單collapse示例詳解,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2023-12-12
vue實(shí)現(xiàn)文字滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)文字滾動(dòng)效果，公告滾動(dòng)播放，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-04-04
Vue.js組件高級(jí)特性實(shí)例詳解
這篇文章主要介紹了Vue.js組件高級(jí)特性,結(jié)合實(shí)例形式詳細(xì)分析了vue.js組件遞歸、模板、動(dòng)態(tài)加載、渲染等相關(guān)操作技巧,需要的朋友可以參考下
2018-12-12
Vue3中如何使用rem來控制字體大小問題
這篇文章主要介紹了Vue3中如何使用rem來控制字體大小問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-07-07
vue-cli如何引入bootstrap工具的方法
本篇文章主要介紹了vue-cli如何引入bootstrap工具的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-10-10
Vue之插槽(Slot)的使用
這篇文章主要介紹了Vue之插槽(Slot)的使用方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2023-11-11