2022-02-09 面试题:vue(三) $router和$route的区别,computed和watch的区别

前端OnTheRun

已于 2023-01-02 21:19:39 修改

阅读量385

点赞数

分类专栏：笔记 vue 文章标签： vue.js 路由 computed watch router

于 2022-02-09 23:27:02 首次发布

本文链接：https://blog.csdn.net/rowlet/article/details/122851862

版权

本文深入探讨了Vue中$router和$route的区别，揭示了它们在VueRouter中的作用和常见API。同时，详细比较了computed与watch的特性，包括缓存、异步操作和数据来源的差异，帮助读者深化理解Vue的这些核心概念。

摘要由CSDN通过智能技术生成

1.`$router`和`$route`的区别?

回答

$router是VueRouter的实例,相当于一个全局的路由对象
里面包含很多个属性和子对象,比如history,和常用的跳转链接this.$router.push
$route对象表示当前的路由信息,包含了当前URL解析得到的信息,包含当前的路由,参数和query对象等等

补充

1.$router常用api:

① this.$router.push('hash 地址') 跳转到指定 hash 地址，并增加一条历史记录
② this.$router.go(数值 n

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

前端OnTheRun

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

2022-03-05 vue面试题:methods,computed和watch的区别和各自的使用场景是什么?

GAARA

03-05

134

watch和computed的异同相同点都是观察页面数据变化的不同点 computed只能当依赖的数据变化时才会计算,当数据没有变化时会读取缓存数据 watch每次都需要执行函数,适用于数据变化时的异步操作 methods,computed和watch的定义和用法回顾 computed 计算属性,会根据所依赖的数据,动态显示新的计算结果并缓存该计算结果 computed的值在getter执行后缓存,若所依赖的数据发生改变会重新调用getter来计算最新结果 watch 是一个对data数据的监听

2022-09-11 面试题:vue(三) vue组件初次渲染和更新的过程,vue页面之间是如何传值的,为什么做首屏优化以及如何做首屏优化

GAARA

09-11

182

1.描述一下vue组件渲染和更新的过程 vue组件初次渲染的过程 vue组件更新的过程 2.什么是组件?为何要封装组件? 封装组件的好处组件的定义 3.vue页面组件之间是如何传值的? 4.computed,watch和methods的区别是什么? 4.为什么要做首屏优化?如何做首屏优化? 做首屏优化的原因实现首屏优化的做法

参与评论您还未登录，请先登录后发表或查看评论

vue3中界面使用router，以及使用watch来监听router的改变

浩星

11-09

1万+

vue3中界面使用router，以及使用watch来监听router的改变

vue $route及$router的区分

whb19881207的专栏

09-27

614

参考网站 https://www.cnblogs.com/czy960731/p/9288830.html https://blog.csdn.net/qxb5215/article/details/80346820 https://www.jianshu.com/p/4ad2a6f7b6ff vue-router学习 1.使用 npm install vue-route...

【Vue】- Router

锋利的绵羊的博客

03-18

229

Vue Router 基础路由的使用步骤是: 引入Vue及Vue Router 告诉Vue Router在哪里渲染(HTML) 把组件(components)映射到路由上在vue实例上注入路由一）基础路由配置给同一个路径匹配多个路由时,先定义的路由优先级最高 <div id="app"> <h1>Hello App</h1> <p&gt...

Vue3.0学习 - 第十七节，vue3中如何使用 router、 watch、computed、和路由监听

csl125的博客

06-16

5594

在vue3.x中使用router和vue2 不一样了在vue2中使用方法： this.$router.push() this.$route.parma

Vue 监听路由变化的三种方式

最新发布

03-13

Vue是一款流行的前端框架，以下是常见的Vue面试题和答案： 1. Vue的优点？答：轻量级框架、简单易学、双向数据绑定、组件化、视图、数据、结构分离、虚拟DOM、运行速度更快。 2. Vue父组件向子组件传递数据？答...

vue-实现路由权限(路由动态渲染)

ygkyufcl的博客

09-22

1624

一、layout/components/Sidebar/index.vue computed:{ routes() { return this.$store.state.routes;//原本是：this.$router.options.routes; } } 二、store/index.js const store = new Vuex.Store({ state: { roles: ['admin'], //角色 routes: [] //路由

$route和$router的区别？vue和react的区别？vue2和vue3的区别？v-if 和 v-show 有什么区别？计算属性computed 和事件 methods 有什么区别？

weixin_48387957的博客

09-08

332

route和route和route和router的区别 $route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。 $router是“路由实例”对象包括了路由的跳转方法，钩子函数等 vue和react的区别？ 1.Vue通过getter/setter以及一些函数的劫持，能精确知道数据变化，不需要特别的优化就能达到很好的性能。React 默认是通过比较引用的方式进行的，如果不优化，可能导致大量不必要的VDOM的重新渲染。Vu

vue获取路由的参数，事件触发路由

qq_42263473的博客

03-25

268

// 获取路由id this.$route.params.路径参数 // 事件触发路由 this.$router.push({path:"/course/step"+【参数】})

vue3获取实时路由

showkw的博客

03-08

1886

vue3获取实时路由每次路由改变相应的值跟着改变

vue computed 传参_不可不知道vue精选面试题上

weixin_39630441的博客

12-06

253

V001-vuerouter是怎么传值的在路由处配置path:'/detail/:id'调用：this.$router.push({ path:'/home/${id}'})在组件内通过this.$route.params.id即可获取。2.在router-link标签中传递参数。 params:{ id:1 }}/>也可通过：this.$route...

router路由导航守卫（基础重点笔记）

不是死水

08-01

355

一. 安装router 二. 在模块化中使用它 1.导入路由对象 import form，并且调用Vue.use（VueRouter）安装，调用Vue.use安装插件前需引入Vue // 配置路由相关的信息 import VueRouter from 'vue-router' import Vue from 'vue' // 1.通过Vue.use安装插件 Vue.use(VueRouter); 2.创建路由实例，并且传入路由映射配置（导出router） const routes =...

watch监控路由 computed计算属性值区别和用法

Chad97的博客

11-26

1400

watch，computed区别 computed属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用； methods方法表示一个具体的操作，主要书写业务逻辑； watch一个对象，键是需要观察的表达式，值是对应回调函数。主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作；可以看作是computed和methods的结合体；语法格式 watch： wa...

Vue灰度发布新功能的那些事

大转转FE

04-19

281

image.png「前言」什么是灰度发布？百度百科的解释如下。❝灰度发布是指在黑与白之间，能够平滑过渡的一种发布方式。AB test就是一种灰度发布方式，让一部分用户继续用A，一部分用户开始用B，如果用户对B没有什么反对意见，那么逐步扩大范围，把所有用户都迁移到B上面来。灰度发布可以保证整体系统的稳定，在初始灰度的时候就可以发现、调整问题，以保证其影响度。❞从上可以看出，...

Vue路由、路由嵌套，以及watch，computed，merhdos方法比较

m0_43391490的博客

06-23

334

什么是路由 **后端路由：**对于普通的网站，所有的超链接都是URL地址，所有的URL地址都对应服务器上对应的资源； **前端路由：**对于单页面应用程序来说，主要通过URL中的hash(#号)来实现不同页面之间的切换，同时，hash有一个特点：HTTP请求中不会包含hash相关的内容；所以，单页面程序中的页面跳转主要用hash实现；在单页面应用程序中，这种通过hash改变来切换页面的方式，称...

vue使用computed计算属性进行传参

骑着代码去流浪

10-06

1万+

需求，根据传递过来的宽高比，进行宽高的重新计算 computed:{ imgWD(o){ return function(o){ return { width:'370px', height:370*(1/o) + 'px' } } } } <div :sty...

2022-02-09 面试题:vue(三) $router和$route的区别,computed和watch的区别

1.$router和$route的区别?

回答

补充

1.`$router`和`$route`的区别?