Vue-路由2 给路由传参

最新推荐文章于 2023-11-15 23:49:22 发布

Leisure Tea

最新推荐文章于 2023-11-15 23:49:22 发布

阅读量220

点赞数

分类专栏： Vue 文章标签： vue

本文链接：https://blog.csdn.net/SevenSongyun/article/details/103652736

版权

Vue-路由2 给路由传参

一、方式1—通过?传递参数

实质

在url中通过 ? 给路由对应的组件传递参数的方式，vue实例会将传递的参数放在$route.query对象中。

注意：

通过?的方式传递参数时，不用修改路由实例中的routes中对象的path路径
在path对应组件中通过 this.$route.query.参数来获取传递的参数
这种传参方式的参数可以不传，仍然可以访问到对应组件

代码示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="../lib/vue.js"></script>
    <script src="../lib/vue-router.js"></script>
</head>
<body>
    <div id="app">
<!--        5.router-link-->
<!--        给/login传递name值，可以不传递参数-->

最低0.47元/天解锁文章

Leisure Tea

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue-路由2 给路由传参

Vue-路由2 给路由传参一、方式1—通过?传递参数实质在url中通过 ? 给路由对应的组件传递参数的方式，vue实例会将传递的参数放在$route.query对象中。注意：通过?的方式传递参数时，不用修改路由实例中的routes中对象的path路径在path对应组件中通过 this.$route.query.参数来获取传递的参数这种传参方式的参数可以不传，仍然可以访问到对应组...
复制链接

扫一扫