如何正确地传递 immutablejs 对象

Question

我正在应用程序中使用 react+flux。我正在尝试使用不可变 js 来加速渲染过程，因为每次我对状态进行任何小的更改时，react 都会尝试协调所有 DOM（这非常慢）。

我遇到的问题是在我的 store.js 中，我可以将我的状态转换为不可变的 Map 对象。但是，一旦这个对象被传递给应用程序，它就不再被识别为 Map 对象，而只是一个普通对象。这意味着我不能使用 Map 对象附带的任何设置或获取函数

这是我目前拥有的：

Store.js

var Immutable = require("immutable");

var Store = function(){   
    var jsState = { object1 : "state of object 1", 
                    object2 : "state of object 2"}
    this.globalState = Immutable.fromJS(globalState);

    this._getGlobalState = function(){
        //console will log: Map { size=2,  _root=ArrayMapNode,  __altered=false,  more...}
        //this.globalState.get("object1"); will work
        console.log(this.globalState); 
        return this.globalState;
    }
}

App.js

var Store = require("./Store.js");
var Map = require("immutable").Map

var App = React.createClass({
    getInitialState: function(){
        return ({});
    },
    componentWillMount: function()
        this._getStateFromStore(); //will get the immutable state from the store
    },
    _getStateFromStore: function()
    {
        return this.setState(Store._getGlobalState());
    },
    render: function(){
        //this will return Object { size=2,  _root=ArrayMapNode,  __altered=false,  more...}
        //this.state.get("object1") will NOT work
        console.log(this.state);
        return <div>This is in App</div>
    }
});

我是不是做错了什么？我是否缺少任何文件中的任何模块？非常感谢！

Answer 1

因此，您实际上不能强制 State 对象成为不可变对象。相反，您必须在您的状态中存储不可变对象。

因此，您需要执行以下操作：

getInitialState: function(){
  return ({
    data: Immutable.Map({})
  });
},

...
_getStateFromStore: function()
{
  return this.setState({
    data: Store._getGlobalState()
  });
},

Facebook has a good example repo on this subject.

如何正确地传递 immutablejs 对象

How to properly pass immutablejs object in flux

javascript

immutability

reactjs-flux

immutable.js