关于vue-router中开发通过props传值的三种方式

最新推荐文章于 2025-07-05 16:37:21 发布

weixin_30384217

最新推荐文章于 2025-07-05 16:37:21 发布

阅读量9k

点赞数 1

CC 4.0 BY-SA版权

文章标签： javascript 前端 ViewUI

原文链接：https://juejin.im/post/5d2546945188250d3d60decd

博客介绍了JavaScript中props不同形式的传值方式。可将props设置为true进行布尔传值，用接受params的方法传递；props为函数时，用query方式传参；props为对象时，可处理静态数据，使用对象模式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先是通过props设置为true,可以进行布尔传值,可以接受params的方法进行传递

                {
                    path:"zdh/:name/:price",//定义其属性
                    component:Zdh,
                    props:true
                
                
                },复制代码

其次是通过props为函数时进行传值,此时用的query方式进行参数的传递

        {
                    path:"zdh",
                    component:Zdh,
                    props : (route) => ({
                            name : route.query.name,
                            age : route.query.age
                    })
                
                
         },复制代码

最后是可以通过props为对象的方式进行处理静态数据,可使用对象模式

                {
                    path:"zdh",
                    component:Zdh,
                    props:{                         name:'zhaodonghao',
                        age:55
                    }
                
                
                },复制代码

转载于:https://juejin.im/post/5d2546945188250d3d60decd