Question

在.net mvc和knockoutjs世界花了很多时间之后，我对React和Redux相对较新。我无法理解的是如何使用商店以及如何在父组件和子组件之间传递道具。

我的第一个问题：如果一组值通过props从父组件发送到子组件，这些组件是否会执行深层复制并创建自己的此组件版本？如果我们有一个相当大的值数组，我们希望多个孩子可以访问，并且我们将它作为道具发送，我们是否会不必要地创建额外的数据，或者他们只是简单地引用相同的数组？

我不确定商店是如何使用的，但是它可以用来帮助上面的场景吗？如果我们有一些像我们想要由多个组件子项访问的更大数组的值，他们可以从这个全局可访问的商店中提取它们吗？

如果有人能帮我理解这些概念，我将不胜感激。在我的工作中，我正在制作一个包含30名学生的表格，每个学生都会收到一组数据，以帮助填写一些行。我担心我们正在做的事情就是给每个学生提供大量他们不需要的数据，如果他们可以从父母或这个全球商店撤出的话。

    <StudentTable
      onSelectAllStudents={this.props.handleSelectAllStudents}
      handleLoadStudentResponses={this.props.handleLoadStudentResponses}
      structures={this.props.structures}
      lessons={this.props.lessons}
      activities={this.props.activities}
      students={this.props.students} />

他们正在创建一个表，每一行都是学生。该表包含大量数据（这是另一个问题）然而，我们基本上正在做的是为每个学生展示他们是否完成了特定的活动。正如您在屏幕截图中看到的那样，他们构建了一个相当复杂的表。在StudentTable中，他们遍历学生并为每行创建一个学生组件，该组件将在活动列表中发送，以便在表格中，他们可以根据活动是否已发布在单元格中着色。我主要担心的是，每个学生组件获取活动列表时，它会向内存中添加大量数据，而不是那些只引用某些父组件的学生组件。

Answer 1

根据我见过的语法，孩子们会收到一个指针。不是一个新对象。关于向30名学生提供整个阵列的问题，您并未正确接近数据传递。向我们展示一个代码段，我就可以发表更多评论。

另外，redux没有帮助。它可以使用，但它过度使用并增加了不必要的复杂性。具有子父关系的组件可以通过正常的React prop传递非常容易地处理。如果组件没有任何直接关系，Redux是首选选项。

编辑：当引用obj中的元素时，会复制基元并指向对象。

const obj = {arrayObject: [], primitiveBoolean: true}
const primitive = obj.primitiveBoolean
const array = obj.arrayObject
primitive = false
console.log(obj.primitiveBoolean); //still true
array.push(10)
console.log(obj.arrayObject); // [10] push changed object's array

React Redux商店 - 所有组件访问

1 个答案: