vue --》路由query 编程式导航传值与监听
1.首先在一个页面设置一个按钮,用于路由跳转
<template> <div> <button @click="handleToRouter">路由传值</button> </div> </template> <script> export default { components:{ }, data() { return { } }, methods: { handleToRouter(){ this.$router.push({ path:"/d", //跳转的路径 query:{n:"我是a",b:"我是b"} //传递的值 }) } }, } </script>
2。在另一个页面接受路由传递的值,并可以通过 $router 监听值的变化
<template> <div> </div> </template> <script> export default { watch: { //监听路由 $route(val){ console.log(val,"333333333333333") }, }, data() { return { routerVal: this.$route.query } }, mounted () { console.log(this.routerVal); }, } </script>