Question

一种有趣的问题...

我有一组所有使用connect来获取状态的组件。这些组件通常是彼此的孩子，有时是深深嵌套的孩子。

我希望只有在状态发生变化时才将这些组件发送到shouldComponentUpdate，否则返回false。状态是不可变映射，我使用is（...）来验证相等性。问题是，当状态发生变化时，其中一些人会看到变化，其中一些看起来会变成旧状态，并且看不到任何变化。如果我完成了另一个改变状态的动作，他们会看到先前的状态，但不是最近的状态。

有什么想法吗？这里没有中间件。

*编辑...代码。这里有很多作品，所以忍受我

function checkNewState(nextProps, instance){
    return !is(nextProps.state.reducerName, instance.props.state.reducerName)
}

const StupidParent = React.createClass({
    shouldComponentUpdate: function(nextProps){
        return checkNewState(nextProps, instance)
    },
    render: function(){
        return <p>{this.props.state.reducerName.get('name')}
            {this.props.replace(this)}
        </p>
    }
})

const StupidChild = React.createClass({
    shouldComponentUpdate: function(nextProps){
        return checkNewState(nextProps, instance);
    },
    render: function(){
        return <p onClick={changeStateNameProperty}>
            {this.props.state.reducerName.get('name')}
        </p>
    }
})

function mapStateToProps(state){
    return {state}
}

export const Parent = connect(mapStateToProps)(StupidParent);
export const Child = connect(mapStateToProps)(StupidChild);


<Parent replace={(parent)=>{
    return <Child />
}} />

Answer 1

只是一个猜测，但检查你是否使用函数shouldComponentUpdate的参数而不是＆＃34; this.prop＆＃34;或者＆＃34; this.state＆＃34;来自你的组件。目前道具/州会给你旧道具/州。新的prosp / state位于importProps / nextState等导入参数中。

shouldComponentUpdate: function(nextProps, nextState) {
  return nextProps.id !== this.props.id;
}

redux连接旧州

1 个答案: