React中使用Immutable

2020-05-22  本文已影响0人  阿羡吖

什么是Immutable

Immutable是一旦创建,就不能被更改的数据。
对Immutable对象的任何修改或添加删除操作都会返回一个新的Immutable对象。
Immutable实现的原理是Persistent Data Structure(持久化数据结构),也就是是永久数据创建新数据时,要保证旧数据同时可用且不变。同时为了避免deepCopy把所有节点都复制一遍带来的性能损耗,Immutable使用了Structural Sharing(结构共享),即如果对象树结点发生变化,只修改这个结点和受它影响的父节点,其他结点进行共享。

在react中immutable中的基本使用

安装

  npm install immutable

使用

1、在reducer中引入,定义初始值

import {fromJS} from 'immutable'
const defaultState =fromJS ({
  focused: false
})
// 在接受到action时
  return state.set('focused',true)

immutable对象的set方法,会结合之前的immutable对象的值和设置的值,返回一个新的对象。

2、在组建中使用

// 使用get
const mapStateToProps = (state) =>{
    return {
        focused:state.header.get('focused')
    }
}
上一篇 下一篇

猜你喜欢

热点阅读