我有一个父组件，有一个子组件，它也有一个子组件。
Parent
|-Child One (child of parent)
|-Child Two (child of child)
当在子二中定义一个值时，我使用回调将该值传递给子一，但我也想将相同的值传递回父级。不幸的是，使用类似的回调似乎两次都会抛出标识符已被声明的错误。
请查看沙箱以了解我到底如何尝试实现它。
代码沙箱 https://codesandbox.io/s/0oucio
我怎么做？
Since ChildTwo组件需要更新其父组件ChildOne和祖父母App。这可以通过两种方式完成。
一种方法是，您创建另一种状态ChildOne并传递其状态函数setValueTwo随着App状态函数valueTwoPass to ChildTwo. ChildTwo现在可以为父母和祖父母设置值。
- Example https://codesandbox.io/s/clever-scott-ktkfty?file=/src/App.js
第二种方法是，您不创建另一个状态ChildOne。由于您需要为父组件和祖父组件显示相同的值，因此您可以传递状态值valueTwo to ChildOne像这样
<ChildOne valueOnePass={valueOnePass} valueTwoPass={valueTwoPass} valueTwo={valueTwo} />
When ChildTwo更新祖父母的状态值App, valueTwo也发生变化ChildOne since App也在经过valueTwo作为它的道具。
然后只需使用valueTwo变量在ChildOne而不是创建新状态并传递给ChildTwo.
- Example https://codesandbox.io/s/charming-ride-nu83lf?file=/src/ChildOne.js
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
