关于(@)computed与autorun

最新推荐文章于 2024-04-19 14:37:29 发布
最新推荐文章于 2024-04-19 14:37:29 发布
阅读量382 收藏
点赞数
分类专栏： mobx
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_16933879/article/details/85065876
版权

相同点：都是响应式调用的表示式

不同点：

(@)computed：1、如果你想响应式的产生一个可以被其它observer使用的值，请使用它

2、computed创建的函数只有当它有自己的观察者时，才会重新计算，否则它的值会被认为是不相关的

 

autorun：1、如果你不想产生一个新值，而想要达到一个效果，请使用它。例如打印日志、持久化或更新UI代码

2、当使用它时，所提供的函数总是立即被触发一次，然后每次它的依赖关系改变时会再次被触发

 

法则：如果你有一个函数应该自动运行，但不会产生一个新值，请使用autorun，其余情况使用computed

圆滚滚的程序媛
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
在微信小程序中使用mobx
08-10
这包括`@computed`计算值和`autorun`、`when`等函数，它们负责监听并响应状态的变更。 4. **Observables（观察者）**：在微信小程序中，`observer`函数类似于React的`React.Component`，它可以自动追踪依赖并触发...
拜托别再用computed传参了，来看看computed原理吧
小王的技术库
05-10 6166
前提 最近本小白接手了个五年老前端做的项目，技术栈是vue2 对于这种临时接盘的项目我内心是非常排斥的， 当然得先学习学习一下五年老前端的代码 结果一看，我还是皱起了眉头 我看到它的computed是这样写的（下面是模拟代码） computed:{ hasXXX(){ return function(b){ return this.a + b } } } // <div>{{hasXXX('111')}}</div> 这是一种compute
mobx @computed的解读
weixin_30580341的博客
12-16 628
写在前面：我一开始看不懂官网的@computed的作用，因为即使我把@computed去掉，依然能正确的report，然后我百度谷歌都找不到答案，下面都是我自己的理解，如果是有问题的，不对的，请务必留言帮我指出。 官网dome： import React, { Component } from 'react'; import mobx, {observable, computed ...
@computed的使用方法
最新发布
weixin_43489042的博客
04-19 131
if (infoStore.getMarried) { // 执行方法 }
vue 的计算属性（computed）和侦听器（watch）
青蛙king的博客
10-27 3170
目录 一、计算属性（computed） 1、计算属性的特点 2、计算属性的原理 3、computed与methods的区别 二、侦听器（wacth） 1、侦听器的特点 2、使用 wacth 的注意事项 3、wacth 的两个属性 4、watch 与 $watch 的关系 5、watch 的使用案例 三、计算属性 和 侦听器 适用场景 四、推荐几篇关于 computed 和 watch 的原理的深度解析好文 一、计算属性（computed） 1、计算属性的特点 支持数据缓....
computed的使用
每天都想吃好吃的
07-08 4200
computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化，computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义.计算属性允许我们对指定的视图，复杂的值计算。computed用来监控自己定义的变量，该变量不在data里面声明，我们还可以使用计算属性根据数据模型中的值或一组值来计算显示值。直接在computed里面定义，进行处理后返回一个结果值。使用简单的表达式对内容进行简单的转换。
Vue3进阶：计算属性（computed）的介绍、使用详解和代码实战案例
SteveRocket's-Blog
12-17 6129
Vue 3中的计算属性是Vue中的一种特殊属性，它基于现有数据进行计算（根据其他属性的值进行动态计算），并返回一个新的值。与方法（methods）相比，计算属性的特点是具有缓存机制，只有依赖的数据发生改变时才会重新计算。关于methods的使用可以参考公众号CTO Plus前面的文章，当然后面的文章也会专门做介绍。计算属性在Vue开发中非常常用，它既能提升开发效率，又能使代码更加简洁和可读性更高。在本文中，我将为大家详细介绍Vue 3中的计算属性的概念、用法和优势。
mobx-978-1-7893-4483-7:MobX 快速入门指南
05-30
`autorun`, `when`, 和 `reaction` 是常用的反应类型，它们可以用来订阅状态变化并在发生变化时执行自定义代码。 ### 3. MobX 与 React 集成 在 React 中，MobX 可以通过 `mobx-react` 包来整合。使用 `@observer`...
mobx1-lesson-exercises-ex-RNR1:GitHub Classroom创建的mobx1-lesson-exercises-ex-RNR1
04-15
5. **反应式计算**：`autorun`, `reaction`和`when`等函数，用于在数据变化时执行副作用，如更新UI、发送网络请求等。 6. **观察者模式**：MobX的底层机制基于观察者模式，当数据变化时，所有依赖该数据的观察者都会...
react-基于reactmobxantd构建的web应用
08-15
开发者只需要声明哪些数据是可观察的（`@observable`），当这些数据变化时，依赖于这些数据的计算值（`@computed`）和反应式函数（`autorun`, `reaction`）会自动更新。这大大降低了状态管理的复杂性，使得应用的...
og-spa-state:跨Onlinegroup SPA的通用状态管理功能
03-26
4. **反应式计算**：使用 `@computed` 装饰器创建基于其他状态的计算属性： ```typescript class MyStore extends Store { @observable counter = 0; @computed get evenCounter() { return this.counter % 2...
MobX中@computed和自定义get函数的区别
知识改变一切
10-22 832
https://blog.csdn.net/cqm1994617/article/details/53271494
computed
丫丫不秃头噢---
09-21 1万+
区别 计算属性有缓存，计算属性会把函数执行一次，把结果存起来，依赖的值改变，会重新赋值。 2.函数是每次模板编译都会执行。只要有响应式属性改变，视图刷新，函数就执行。 计算属性computed 支持缓存，只有当它所依赖的响应式数据发生改变时，才会重新进行计算 不支持异步，当computed内有异步操作时无效，无法监听数据的变化 3.computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中的数据通过计算
Vue中的计算属性computed的用法
qq_43483403的博客
08-04 1万+
1.基本属性 2. 优势属性：缓存 3.对象属性（set和get）
理解mobx @computed、autorun、get函数
qq_23921097的博客
07-18 7013
第一篇博客记录一下刚工作时思考的问题。 1.首先看第一个例子： const number = observable(10); const plus = computed(() =&gt; number.get() &gt; 0); autorun(() =&gt; { console.log(plus.get()); }); // true number.set(-19);//fals...
vue中computed的作用以及用法
热门推荐
weixin_33686714的博客
05-31 1万+
在vue中computed是计算属性，主要作用是把数据存储到内存中，减少不必要的请求，还可以利用computed给子组件的data赋值。 参考地址：https://www.jianshu.com/p/ff708a773dc0 // 父组件 <template> <div> <navbar :ctype="ctype">&lt...
vue项目中computed用法讲解
weixin_56496578的博客
04-03 5299
计算属性出现的目的是解决模板中放入过多的逻辑会让模板过重且难以维护的问题. 计算属性是根据data中已有的属性，计算得到一个新的属性. 下面，我们可以通过一个案例来学习一下计算属性、 在一个文本框中输入第一个名字，第二个文本框中输入第二个名字，然后展示全部名称。 了解了计算属性后，下面对用户列表添加一个功能，要求是计算总人数。 可以在ul列表下面，添加如下的代码。 最终展示出了，对应的人数，但是这里在模板中做了运算（在这里做了字符串拼接，虽然计算简单，但是最好还是通过计算属性..
Vue之computed计算属性
sunlizhen的专栏
05-09 677
1. 计算属性就是根据一定的逻辑，将一个新属性与data数据的某个属性进行关联，由此获取与原数据对应的值 在一个计算属性里可以完成各种复杂的逻辑，包括运算、函数调用等，只要最终返回一个结果就可以 2.简单的说，就是data中有数据A，另一个B结果与A有一定的关联，需要A通过计算得到，既可以用计算属性； 如： <div id="test"> 你输入的：<input...
vue中computed与watcher
10-09
在Vue中，computed和watcher是两种不同的属性，用于响应式地处理数据的变化。 computed属性是基于依赖关系进行缓存的计算属性。它是一个函数，在Vue实例中定义，可以根据依赖的数据自动计算出一个新的值。当依赖的...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值