javascript - React Redux 组件不会在状态更改时重新渲染

Question

如何确保触发状态更改并在组件中捕获它？

我的应用程序有一个操作，该操作是在单击过滤器组件时触发的。此过滤器执行搜索并返回新产品(基于过滤器)。

该操作有效，并且使用 React Chrome 扩展，我可以看到产品的全局状态发生变化。但是我无法在我的 shopComponent 中获取新状态，这将根据新产品状态更改显示的产品..:(

class shopProduct extends Component {

    constructor(props) {
        super(props);
        this.state = {...localStateItems }
    }

    render() {
        if(this.props.products != undefined) {
          console.log('not undefined: ', this.props.products);
          // NOTHING IS SHOWING
        }
        console.log('shopProducts Render: ', this.props);
        // NOTHING IS SHOWING

        return (
            ...Some new products
        )
    }
}

const mapStateToProps = (state, ownProps) => ({
    cart: state.cart,
    products: state.products
});

shopProduct.propTypes = {
    productSearch: PropTypes.func.isRequired,
    products: PropTypes.object
};

export default connect(mapStateToProps, { productSearch, products })(shopProduct);

我是否正确地将其映射到 shopProduct 组件？

Answer 1

我认为您误解了传递给 connect 的第二个参数应该是什么。根据the docs它应该是mapDispatchToProps。您正在尝试传递您的 propTypes，这不是第二个参数所期望的。您可能想阅读 what mapDispatchToProps is for .