首页 > 其他分享 >vue3 router 路由传参

vue3 router 路由传参

时间:2023-05-26 14:23:49浏览次数:44  
标签:传参 const useRoute vue3 import router 路由

路由跳转

import router from "@/router";


router.push({ path: "/iframe", query: { url: frameurl.value } });

获取参数

import router from "@/router";
import { useRoute } from "vue-router";

const route = useRoute();
const frameurl = <string>route.query.url;

// 返回
const navigateBack = () => {
  router.go(-2);
};

 

标签:传参,const,useRoute,vue3,import,router,路由
From: https://www.cnblogs.com/jqynr/p/17434586.html

相关文章

  • vue3 组件传参
    父组件  子组件<iframe:src="props.src"width="100%"height="100%"frameborder="0"id="_iframe"></iframe>接收参数constprops=defineProps({src:{type:......
  • elementplus vue3 ts 单图预览封装
    <divclass="demo-image__preview"><el-imagestyle="width:50px":src="props.image":zoom-rate="1.2":preview-src-list="[props.image]":initial-index="4&quo......
  • vue3 打包超出限制 Some chunks are larger than 500 kBs after minification
    vite.config.ts,build:{//如果自己分片的话,就会生成37个文件//chunkSizeWarningLimit:1000,//rollupOptions:{//output:{//manualChunks(id){//if(id.includes('node_modules')){//re......
  • vue3 reactive响应式赋值页面不渲染问题
    问题描述://声明变量letdata=reactive([]);http().then(res=>{data=res.dataconsole.log(data)})//data数据更新,页面没有渲染,1、因数据结构而导致的未渲染解决方法:依旧是reactive,可以在外面包一层//声明letstate=reactive({data:[]})//赋值state......
  • Vue3.3 的新功能的体验(下):泛型组件(Generic Component) 与 defineSlots
    上一篇说了DefineOptions、defineModel、Props的响应式解构和从外部导入类型这几个新功能,但是没有说Generic、defineSlots等,这是因为还没有完全搞清楚可以用在什么地方。折腾了几天终于弄清楚了。这还要从TS的泛型说起。泛型的目的和意义泛型仅仅只是表达传啥都行吗?当然......
  • 解决vue3自动引入element-plus后eslint警告
    配置vue.config.js......module.exports=defineConfig({......configureWebpack:{plugins:[AutoImport({resolvers:[ElementPlusResolver()],eslintrc:{enabled:true,filepath:"./.eslintrc-auto......
  • vue3组件间通信
    props父子组件之间通信最好的方式//父组件<template><divclass="box"><h1>props:这里是父组件</h1><hr/><Child:money="money"></Child></div></template><scriptsetuplang="......
  • vue3+vite build打包删除控制台打印
    很简单,直接在vite.config.ts里面添加配置即可:exportdefault({mode})=>defineConfig({build:{minify:"terser",terserOptions:{compress:{//生产环境时移除consoledrop_console:true,drop_debugger:true,......
  • Vue3——基于tdesign封装一个通用的查询组件
    前言基于Vue3+TS+tdesign封装一个通用的查询组件;临时写的一个demo内容组件代码<template><t-formref="form":model="formData"inline><t-form-itemv-for="iteminformConfig":key="item.name":label="item.label&qu......
  • vue3.0组件封装
    组件全局祖册1.建立公共文件夹my-ui2.index.js文件导出全局祖册组件的install方法3.main.js中impotindex.js导入install方法使用并useimportmyUifrom'./components/my-ui'createApp(App).use(myUi).mount('#app')......