初涉RN RN中的MobX

在刚开始做页面时, 数据绑定的时候, 对一个为array的list进行了observable, 里面的值改变的时候, 并不会重新渲染页面

这里面就涉及到MobX会对什么做出反应?这个问题

MobX会对在追踪函数执行过程读取现存的可观察属性做出反应

"读取":是对象属性的间接引用, 可以用过"."或者"[ ]"的形式完成. eg:user.name或者user['name']

"追踪函数"是computed表达式,observer组件的render()方法和when, reaction 和 autorun的第一个入参函数

"过程(during)"意味着只追踪那些在函数执行时被读取的observable.这些值是否由追踪函数直接或间接使用并不重要

换句话说,MobX 不会对其作出反应:

  • 从 observable 获取的值,但是在追踪函数之外
  • 在异步调用的代码块中读取的 observable

后来查看了官方文档, 才发现MobX追踪属性访问, 而不是值

通过官方的文档和图可以清晰的看出来

比如代码如下:

let message = observable({
    title: "Foo",
    author: {
        name: "Michel"
    },
    likes: [
        "John", "Sara"
    ]
})


现在 MobX 基本上所做的是记录你在函数中使用的是哪个箭头。之后,只要这些箭头中的其中一个改变了(它们开始引用别的东西了),它就会重新运行。

比如有个数字list= [1, 2, 3], 如果观测list 当list[0]=5,的时候, 这个时候并不会引起重新渲染, 就像图上面的值是改变的, 但是箭头的指向仍然是原来的, 所以就不用改变, 这个我感觉有点像c,c++中的指针, 只有当指针的指向发生改变的时候, 才能被重新观察到, 如果里面的值改变, 是不会引起重新渲染的.

这个时候可以将list中使用observable, 它在默认情况下会进行递归应用, 到每个list[0],list[1],list[2]中, 但是这样会引起大量的重复渲染, 最好的还是将每个模块细分化, 渲染的时候只渲染一部分


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章