您现在的位置是:首页 > Javascript
当前栏目
vue中的路由传参
2023-03-31 11:02:33 时间
路由传参的三种写法
首先要采用编程式导航
第一种:字符串形式
this.$router.push("/search/" + this.keyword + "?k=" + this.keyword.toUpperCase());
路由配置中的 path 需要占位
第二种:模板字符串新形式
this.$router.push(`/search/${this.keyword}?k=${this.keyword.toUpperCase()}`);
路由配置中的 path 需要占位
第三种:对象形式
this.$router.push({name: "search", params: {kerword: this.keyword}, query: {k: this.keyword.toUpperCase()}});
需要给路由命名
注:
1、路由跳转传参时,对象的写法可以是 name、path 的形式,但是 path 不能和 params 一起使用
2、如果路由配置中存在 params 参数占位,当你不传递 params 参数时 URL 存在问题。此时可以在 path 中占位的后面加上 ? 可以让 params 可传可不传
3、当 params 可传可不传时 传递空串 可以用 || undefinde 解决
4、路由组件可以通过 props 传递参数。布尔值只传递 params 、对象写法可以额外传递一些如 a: 1, ...... 、函数写法可以传递 params 和 query 参数。
相关文章
- TiDB Binlog 组件正式开源
- 使用Visual Studio Code对Node.js进行断点调试
- 推荐!数据可视化的十种优秀JavaScript图表库
- Node.js在复杂集成场景下占据统治地位的五个理由
- 玩转Node.js单元测试
- Node.js中内存泄漏分析
- Angular对React:一场关于Web开发者支持率的史诗对决
- 热点推荐:什么是后端开发?
- 谈谈Spring boot 启动层面的开发
- 使用NodeJS将文件或图像上传到服务器
- 编写React组件的最佳实践
- JavaScript MV*框架最值得关注的七个亮点
- 前端开发指南:如何利用PHP Cake框架构建应用
- 基于React与Vue后,移动开源项目Weex如何定义未来
- NodeJS和C++之间的类型转换
- jQuery中的常用到的三十九个技巧
- 官宣|Google Developers中国网站发布!
- NodeJS和C++之间的类型转换
- .NET Core首例Office开源跨平台组件(NPOI Core)
- 如何写出漂亮的React组件