Question

当我将状态映射到特定组件的道具时，即使状态发生变化，各个道具似乎也不会更新。当我将整个状态映射到组件时，我得到了我想要的行为（因为状态已经改变）。见下文。

const Dashboard = ({ state, justMarkets, justItems }) => {
  console.log('state', state);
  console.log('state markets', state.markets);
  console.log('just markets', justMarkets);

  console.log('state items', state.items);
  console.log('justItems', justItems)
  const markets = state.markets, 
        items = state.items;
  return (
    <div>
      {
        markets
           .filter(market => market.hasItems)
           .map(market => {
                const { 
                    marketname: name, 
                    id, 
                    Products, 
                    Address, 
                    GoogleLink 
                } = market;

                return (
                    <div className="market" key={id}>
                      <div>
                        <h1>{name}</h1>
                        <h2>{Address}</h2>
                        <a href={GoogleLink} target="_blank">View in Google Maps</a>
                      </div>
                      <Items items={items} products={Products} />
                   </div>
                );
            })
         }
      </div>
    );
};

const mapStateToProps = state => ({ 
     state, 
     justMarkets: state.markets, 
     justItems: state.items 
});
export default connect(mapStateToProps, null)(Dashboard);

如果您看到此image，您会注意到状态更新后，我只能使用state.markets和state.items从组件中访问更新后的状态。我似乎无法直接在mapStateToProps中访问它们（状态更新后，justMarkets和justItems都为空数组）。非常感谢对此事的任何见解!!!

Answer 1

想出来！问题实际上在减速器中。在reducer中，我的代码写成：

return Object.assign({}, state, action.propObj)

应该是什么时候

{{1}}

啊，语义学。我认为Object.assign自己返回了一个新对象，但是，在阅读完文档之后，我现在知道它返回了第一个参数。

所以这基本上是一个经典的可变性bug。我正在覆盖状态对象的属性并使用更新的属性返回先前的状态。由于redux浅层检查更改并且指向状态对象的指针没有更改，因此我的状态更新未在mapStateToProps中注册，但我可以直接从组件中的状态访问该属性。

React-Redux：mapStateToProps不使用单个属性进行更新，但在映射整个状态/存储时会连接

1 个答案: