反应父组件向子组件传递具有不同名称的道具答案

【问题标题】：react parent components passing child a prop with different name反应父组件向子组件传递具有不同名称的道具
【发布时间】：2022-06-30 22:07:17
【问题描述】：

对不起，糟糕的问题名称，我想知道是否有一种标准方法可以为来自不同父母的同一个道具传递不同的值，以及我传播道具的方式是否有问题。

父母 1：

<ChildComponent
prop1={prop1}
prop2={prop2}
paymentProcessingDate={Date.now()}
...passThroughProps
>

具有道具 carServiceDate 的父级 2

<ChildComponent
prop1={prop1}
prop2={prop2}
paymentProcessingDate={carServiceAppointment.date}
...passThroughProps
>

Parent1 和 Parent2 都使用 ChildComponent，但需要为 paymentProcessingDate 传入不同的值。我收到一个错误，即 passThroughProps 的传播将始终覆盖 paymentProcessingDate 但第一次使用或定义 paymentProcessingDate 是在对 ChildComponent 的调用中。非常感谢任何帮助或建议！

【问题讨论】：

I'm receiving an error that the spread of passThroughProps will always overwrite paymentProcessingDate 然后换个顺序：先传播，再传道具。最后出现的行将覆盖最先出现的行。
您的passThroughProps 是什么样的？听起来它是一个对象，其键名为 paymentProcessingDate 正在覆盖原始值

标签： javascript reactjs

【解决方案1】：

...passThroughProps 必须包含 paymentProcessingDate 的值，因此 TypeScript 抱怨您的 spread prop 将覆盖您明确设置的任何内容。

尝试将点差移到顶部，看看是否可以解决问题：

<ChildComponent
...passThroughProps
prop1={prop1}
prop2={prop2}
paymentProcessingDate={carServiceAppointment.date}
>

【讨论】：