Question

那么我如何才能拥有一个从父母那里获取一些默认道具的组件，还有一个商店？这似乎似乎有冲突。

<Mycomponent foo="bar">

...这意味着我的组件有一些名为“foo”的状态/道具，其值与我的商店不了解。这不会破坏模式的可见性设计吗？我是否需要将这些初始道具传递到我的商店中的一种反应生命周期方法？这似乎是额外的工作，也很脆弱。

我也发现将商店的状态映射到组件props对象有点令人沮丧。例如，我有一个带有一些字段的表单，他们可以从父

获取默认值

<MyForm input1="red", input2="blue">

商店的初始状态可能如下所示

{
  status: valid,
  modified: false,
  form: {
    input1: ""
    input2: ""
  }
}

在组件呈现之前我的本地道具看起来像这样

{
   input1: "red"
   input2: "blue"
}

但是当事情在mapStateToProps中重新映射...

var mapStateToProps = function(state) {
    return state;
}

最终看起来像这样。

{
  form: {
    input1: "red"
    input2: "blue"
  }
 status: valid,
 modified: false,
 input1: "red"
 input2: "blue"
}

因为“form”对象之外的key1和key2 props来自父对象传递的初始组件属性。它们不是商店的状态对象的一部分。我真的希望道具对象与商店相匹配，但除非我开始删除内容，否则它似乎无法实现。我们似乎以两种方式使用this.props对象，感觉不正确。

我真正想要的是来自父母的属性直接进入我的商店，从那里我希望我的组件仅基于我的商店进行渲染。我觉得react-redux不适应反应生命周期，或者至少我不明白它应该如何使用。

Answer 1

结帐文档：https://github.com/reactjs/react-redux/blob/master/docs/api.md - mapStateToProps - 参数：ownProps：

如果将ownProps指定为第二个参数，则其值将是传递给组件的props

您有以下API说明示例。它可能会有所帮助。

而且，我认为你犯了错误。 Redux适用于组件的内部状态。我使用状态来操作数据，这反映在GUI上，但它们与应用程序的其余部分无关（例如：手风琴菜单中的isVisible标志）。

只有从商店获取了一些数据时才应使用容器（连接到商店的组件），否则使用哑组件。

组合容器，根据需要嵌套它们，避免在一个容器中检索大块状态。

您还应该获取对您的组件很重要的数据。如果你的容器必须知道所有关于整个状态...好吧，似乎应用程序的体系结构有问题。我只将几个属性从州直接映射到道具：

const mapStateToProps = (state) => {
    return {
       status: state.status,
       field1: state.form.field1,
       field2: state.form.field2
    }
}

所以我最终得到了平面地图。

请注意，redux执行新道具的浅层比较：

https://github.com/reactjs/react-redux/blob/master/docs/api.md

如果为true，则实现shouldComponentUpdate并浅显地比较mergeProps的结果，防止不必要的更新，假设组件是“纯”组件，并且不依赖于除其props和选定的Redux存储状态之外的任何输入或状态。默认为true。

并且不要在简单的应用程序中使用redux，它适用于更大的项目。

如何将默认道具传递给存储

1 个答案: