面试官问你computed，methods和watch有什么区别，分别适合在什么时候使用？

最新推荐文章于 2022-09-30 11:26:57 发布
最新推荐文章于 2022-09-30 11:26:57 发布
阅读量417 收藏 1
点赞数 1
分类专栏： 前端从入门到精通 # 关于前端面试的那些事 文章标签： 前端 小程序 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/troyesivanlp/article/details/123341496
版权

computed和methods中方法的区别？

  • computed具有缓存特性，只会计算一次，在依赖的变量不发生变化的时候，即使页面调用多次，也不会发生重复计算。
  • metheds在页面调用多少次，就会执行多少次.

computed和watch适合分别在什么时候使用？

  • 当多个元素发生变化导致一个结果进行变更的时候可以使用computed,场景：购物车商品结算
  • 当一个元素发生变化导致多个结果进行变更的时候可以使用watch 场景：搜索框
咖啡壶子
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
vue面试题；Vue中的computed和watch有什么区别？请举例说明
06-07
Vue中的computed和watch有什么区别？请举例说明。 请解释Vue的生命周期函数及其执行顺序。 请解释Vue的指令和组件的区别，以及它们各自的用途。 Vue使用v-model指令时，如何自定义输入框的类型？ Vue的路由是...
什么时候用methods什么时候用computed？计算属性和方法的区别？
A444477的博客
11-29 1113
methods一般运用在需要主动触发的事件上，computed则是用在响应对某个数据的处理上。 computed依靠自己的依赖进行缓存，因为着只要依赖的变量不变，计算属性返回的值永远是原来运行的结果。而methods每次渲染调用就会和函数一样重新执行一次。 ...
vue：计算属性（computed）
fly_distance的博客
08-12 2493
一、计算属性？什么东东？？ <div id="example"> {{ message.split('').reverse().join('') }} &a
搞明白Vue什时候该用computed和watch
小帅的编程笔记
11-12 3893
Vue框架中的两大重要特性computed和watch，它们之前有相似的地方，那么今天我们来说说为什么要有computed和watch？以及它们的使用场景？什么时候用computed？什么时候用watch？它们之间有什么差别呢？请看今天的文章 为什么有计算属性computed 在Vue中，我们可以轻松的实现数据到DOM映射，使用模板内的表达式也很方便，但如果在模板内写入太多的逻辑的话就会让模板难以维护。 <template> <div :title="msg"> {{ m
在Vue中什么情况用computed，watch，methods理解
Seven_Amber的博客
10-08 950
根据原本的例子，补充自己的一点想法，整理如下： 用一个例子来说明一下吧： <div id="demo"> <p>message: "{{ message }}"</p> <p>reversed message: "{{ reversedMessage }}"</p> <button @click="add">...
Vue的computed不改变data值
niefuqiang的博客
04-12 2336
**关于computed的计算属性是否改变data的原来的值，废话不说直接上代码，实现一个搜索 // DOM代码 <div id="app"> <input type="text" placeholder="请输入姓名" @input="setName" v-model="name" /> <ul v-for="(item, index) in nam...
请问Vue中的computed和watch有什么区别？在什么情况下应该使用computed，什么情况下应该使用watch？
03-09
请问Vue中的computed和watch有什么区别？在什么情况下应该使用computed，什么情况下应该使用watch？
vue中watch和computed的区别与使用方法
10-14
主要给大家介绍了关于vue中watch和computed的区别与使用方法的相关资料，文中通过实例代码结束的非常详细，对大家学习或者使用Vue具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
在微信小程序里使用 watch 和 computed
03-29
在开发 vue 的时候，我们可以使用 watch 和 computed 很方便的检测数据的变化，从而做出相应的改变，但是在小程序里，只能在数据改变时手动触发 this.setData()，那么如何给小程序也加上这两个功能呢？ 我们知道在 ...
Vue中computed、methods与watch的区别总结
10-17
主要给大家介绍了关于Vue中computed、methods与watch区别的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用Vue具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
vue定义在computed的变量无法更新
明日复明日的博客
05-10 6563
情境是这是线上商城的详情页面，商品详情是items数组，点击分类页面的商品，路由跳转到详情页面，路由参数是商品在items中的序号。 但是问题是只有第一次点击商品i的时候可以正常加载items[i]的数据到html中，退出后点击商品j，发现加载的还是商品i的信息，只有刷新后才会更新成商品j的信息。 部分代码： <shopPanel :key = "nums" :goodname="item.text" :tag="
vue中computed和watch的使用场景
ltlt654321的博客
09-30 3649
vue中computed和watch的使用场景
computed用发_vue.js中，什么时候用methods？什么时候用computed？什么时候用watch
weixin_39616045的博客
12-19 867
展开全部1、methods是个方法，比如你点击事件要执行一个方法，这时候就用methods,2、computed是计算属性，实时响应32313133353236313431303231363533e78988e69d8331333365643662的，比如你要根据data里一个值随时变化做出一些处理，就用computed。3、举一个例子帮助理解：1)；2) ；3) var vm =...
vue computed正确使用方式
热门推荐
李刚的学习专栏
07-03 11万+
最近面试中，遇到一个小伙子，谈到了vue中的 computed 和 watch 区别，最后得到了一个让我瞠目结舌的答案，只用 watch，从不用 computed 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护，所以，对于复杂逻辑，vue 提倡使用计算属性。需要特别说明：计算属性的 getter 函数是没有副作用 (side effec...
vue实例下的computed什么时候执行？
irose的博客
05-15 1万+
初始化的时候执行和相关的data发生变化后执行。 举个例子，当我修改第一行和第二行时，第三行就会发生改变。 改变前： 改变后： 代码： <form id="app" action=""> <div> <label>姓 <input type="text" placeholder="请输入你的姓" v-model="xing"> </label> </div>
使用computed计算属性进行传参
xlelou的博客
08-07 2万+
需求，根据传递过来的宽高比，进行宽高的重新计算 computed:{ imgWD(o){ return function(o){ return { width:'370px', height:370*(1/o) + 'px' } } } } &lt;div ...
computed和watch的使用场景
m0_53200294的博客
06-16 1381
computed & watch 使用及处理的场景
computed、watch和methods使用场景的区分
m0_61205381的博客
06-21 241
computed、watch在数据变化时改变，在一般情况下使用computed；在频繁变动的场景下，如动画，无需写入缓存，watch有一定优势；而methods是指函数，所以需要主动调用，调用时发生改变。 计算属性，关注点是结果，计算的结果会存入缓存中，最常用的计算属性，计算出结果后即不用 watch 侦听器，关注点是过程，由于没有缓存，对于一直变化的的值有一定优势，免去了每次变化都要写入缓存的开销。 methods 与前两者不同，打一鞭子动一下，只有调用时才发生改变。而computed、watch只需要数
【Vue基础】computed，watch，methods的用法区别
梨子的博客
10-29 307
在编程的中我们常常可以发现对于某些功能我们可以采用方法实现，也可以用watch或者计算属性去实现，那么这三种实现有什么区别呢？？？ 通一个简单的案例来研究一下 methods methods是一个对象属性的函数，methods不存在缓存，，在重新渲染的时候，函数总会重新调用执行。 methods实现： <!--准备容器--> <div id="root"> 姓：<input type="text" v-model="firstName"><
computed 和 watch 有什么区别？一般你都在什么地方使用？
最新发布
03-28
`computed` 和 `watch` 都是 Vue.js 中用于响应式数据的处理方式，但它们的应用场景是不同的： - `computed` 是计算属性，它会根据依赖的数据自动计算出一个新的值，并且缓存这个值，只有当依赖的数据变化时才重新...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

咖啡壶子

你的鼓励奖是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值