Reactjs 是否将动态值传递给同级？

大家好，我对编码和反应有点陌生（~3周），所以如果我以一种奇怪的方式问这个问题，请让我知道，我会尽力澄清

我正在处理这两个组件，我希望将从组件1动态生成的数据传递给组件2（请参见下面的代码）

在COMPONENT1中，我使用map动态显示一组按钮。然后使用JSX根据定义的对象数组的数据动态添加文本。这很好，但我想做的是获取一些动态呈现的数据，并将其传递到COMPONENT2，即每个按钮都可以将特定数据发送到COMPONENT2

特别是，我希望能够根据我按下的按钮动态地将obj.text发送到COMPONENT2

组成部分1

export default function Button(props){
 const arrObj = [
   { id: '0', var: 'varString1', text: 'textString1'},
   { id: '1', var: 'varString2', text: 'textString2'}
 ]

 return (
  <div>
   {arrObj.map( (item) =>
    <div key={obj.id}>
     <Icon> {`${obj.var}`}<span> {`${obj.text`}</span></Icon>
     <Button>{'add something'}</Button>
    </div>
}

导出默认功能按钮（道具）{
康斯特·阿罗布=[
{id:'0'，var:'varString1'，text:'textString1'}，
{id:'1'，var:'varString2'，text:'textString2'}
]
返回(
{arrObj.map（（项目）=>
{`${obj.var}}{`${obj.text`}
{'add something'}
}

构成部分2

 const Style = (props) => {
  return(
   <div>
     <h1>{`Please ${props.ojb.text}`}</h1>
     <Button> {`Please ${props.ojb.text}`} </Button> 
  </div> 
)

const Style=（道具）=>{
返回(
{`Please${props.ojb.text}`
{`Please${props.ojb.text}`
)

我期望的快速示例：

组件1：

 <Icon>{refresh}<span> Refresh the page </span>
 <Button onClick=(send "Refresh the page to COMPONENT2")></Button>

{refresh}刷新页面

组件2：

 <h1> Please Refresh the Page </h1>
 <Button> Please Refresh the Page </Button>

请刷新页面
请刷新页面

注意：如果有帮助的话，我将使用材质UI来设置这些组件的样式

---

请再次告诉我，是否有任何让人困惑的地方，以及我是否可以做些什么来澄清。此外，在状态管理方面，我不希望使用redux，但我愿意接受任何反馈。

如果COMPONENT2是COMPONENT1的子组件：

将单击的按钮值

obj.text

保存到组件1的状态 并将其传递给COMPONENT2，您可以添加一个函数来更改该状态 按钮的

onClick

事件上的对象

如果组件1和组件2是同级组件：

在其父组件中创建一个函数，使用props从组件1获取值，并将其从父组件传递给组件2

使用上下文API或存储。（如果您的场景很简单，那就太过分了）

---

最重要的是，欢迎大家反应并愉快地编码！：）

如果组件2是组件1的子组件：

将单击的按钮值

obj.text

保存到组件1的状态 并将其传递给COMPONENT2，您可以添加一个函数来更改该状态 按钮的

onClick

事件上的对象

如果组件1和组件2是同级组件：

在其父组件中创建一个函数，使用props从组件1获取值，并将其从父组件传递给组件2

使用上下文API或存储。（如果您的场景很简单，那就太过分了）

---

最重要的是，欢迎您做出反应并愉快地编码！：）

你能给出更多的细节吗？关于你想要达到什么？嘿，Fr.Fr.Brand抱歉，我正在尝试从组件1到组件2动态添加的数据，但是我用它来计算出来：结果我可以用EV.CurrutalTest.Valk获得这个值，从组件1的按钮中得到Obj.txt，把它传递给PAR。ent，然后将其作为道具传递给COMPONENT2，您能提供更多详细信息吗？嘿@FranBran很抱歉，我试图将动态添加的数据从COMPONENT1传递到COMPONENT2，但我通过以下方法解决了这个问题：原来我可以使用ev.currentTarget.value从but获取obj.txt在COMPONENT1中，将其传递给父对象，然后将其作为道具传递给Component2Tanks！我可以使用以下方法来解决它：特别是使用ev.currentTarget.value来获取在COMPONENT1中动态呈现的obj.txt，然后看起来我使用了您提到的第二种方法，即从COMPONENT1获取值，然后将其传递给我还不知道如何使用上下文API，但是我从我在网上看到的所有信息中得知，我想当我重构代码lol时，我需要这样做。再次感谢您的帮助！谢谢！我能够使用以下方法找到答案：尤其是ev.currentTarget.value来获取动态渲染的obj.txt在COMPONENT1中出现红色，然后看起来我使用了您提到的第二种方法，即从COMPONENT1中获取值，然后将其传递给父级，然后再将其传递回COMPONENT2。我还不确定如何使用上下文API，但我来自我在网上看到的所有信息，我认为我在重构代码时需要这些信息。lol。再次感谢您的帮助lp！