React redux状态发生了变化，但在组件视图中却没有更新UI。

Question

const mapStateToProps = state => {
return {
    products: state.priceTabProducts
  };
};

class App extends Component {

render() {
    return (
        <div>
            <Layout>
                <Route path="/:product" component={ProductsPage}/>
                <ProductsTab
                    show={this.props.showPriceTab}
                    quantity={this.props.products.length}
                />
            </Layout>
        </div>
    );
}

}

我改变了状态，工作很好，我想把长度传给组件，但它的值没有改变。我如何解决这个问题？

Answer 1

问题是，你突变了状态，因为如果引用没有改变，重新渲染将不会被触发。你应该使用concat更新数组。

export function priceTabProducts(state = [], action) { 
   switch (action.type) { 
       case PRICE_TAB_PRODUCTS: return state.concat(action.payload);
       default: return state 
   } 
}