时间戳

首页 > 解决方案 > 使用 react-redux 正确映射 stateToProps

reactjs - 使用 react-redux 正确映射 stateToProps

问题描述

我是项目的 react-redux 范例的新手，我对将状态映射到道具的概念有点困惑。我创建了一个具有初始值的商店：

export function initialState() {
    return { priceRange:[0,10000] }
}

然后在我的子组件中我 mapStateToProps 像这样：

const mapDispatchToProps = { onPriceRangeChange }
const mapStateToProps = {priceRange}  = ({
    value:priceRange
})

export default connect(mapStateToProps, mapDispatchToProps)(HomeMap)

问题是它'priceRange' is not defined no-undef出错了。有任何想法吗？

标签： reactjsredux

解决方案

这是因为您必须定义您的mapStateToProps，如下所示：

const mapStateToProps = ({ priceRange }) => ({
    value: priceRange
})

它与以下内容相同：

const mapStateToProps = state => ({
    value: state.priceRange
})

这种技术称为解构赋值：

解构赋值语法是一种 JavaScript 表达式，它可以将数组中的值或对象中的属性解包到不同的变量中。

推荐阅读