route 与 router 之间的差别

简述:

router:主要用于处理一些动作,

route:主要获得或处理一些数据,比如地址、参数等

例:

videoInfo1.vue:

javascript 复制代码
<template>
  <div class="video-info">
    <h3>二级组件:点赞情况分析</h3>
  </div>
</template>

<script>
export default {
  name: 'video-Info1',
  created () {
    setTimeout(() => {
      // 这里router进行路由跳转
      this.$router.push({ name: 'video-info2', query: { somedata: 'info1传递来的信息' } })
    }, 3000)
  }
}
</script>

<style>

</style>

videoInfo2.vue:

javascript 复制代码
<template>
  <div class="video-info">
    <h3>二级组件:互动情况分析</h3>
  </div>
</template>

<script>
export default {
  name: 'video-info2',
  mounted () {
    console.log(this.$route.query)
    // 这里route进行数据获取
  }
}
</script>

<style>

</style>

用户主动点info2,输出为空;

从 info1 跳转到 info2 后,info2 输出从 info1 传递过来的数据:

相关推荐
美狐美颜sdk18 小时前
从人脸关键点到动态贴图:面具特效在美颜SDK中的实现原理
前端·图像处理·人工智能·直播美颜sdk·美颜api
我命由我1234518 小时前
React Router 6 - 编程式路由导航、useInRouterContext、useNavigationType
前端·javascript·react.js·前端框架·html·ecmascript·js
威联通网络存储19 小时前
告别掉帧与素材损毁:威联通 QuTS hero 如何重塑影视后期协同工作流
前端·网络·人工智能·python
anOnion19 小时前
构建无障碍组件之Tabs Pattern
前端·html·交互设计
啃玉米的艺术家19 小时前
UART实验
网络
一招定胜负20 小时前
课堂教学质量综合评分系统
java·linux·前端
2301_7806698620 小时前
前端logo替换开发
前端·vue.js
思为无线NiceRF20 小时前
UWB电子围栏方案:一体化设计,宠物防走失+训导双突破
网络
加密棱镜20 小时前
掘金 2026 网安市场:从合规驱动到创新驱动的投资机遇
网络
启山智软20 小时前
【启山智软智能商城系统技术架构剖析】
java·前端·架构