[英]How to pass data from one component to another via a function in ReactJS?
How can I pass the data parameter from the openTeam function to another component in another file?如何将 openTeam function 中的数据参数传递给另一个文件中的另一个组件? The data can't change value, because it has an id in it that can't be changed.
数据不能改变值,因为它有一个不能改变的 id。 I am using functional components in my app.
我在我的应用程序中使用功能组件。
const openTeam = (data) => {
history.push("/" + data.name)
return (
<div>
</div>
)
}
return (
<div>
<Welcome />
<div>
<ul>
{teams.map((data) => {
return (
<li onClick={() => openTeam(data)} key={data.teamId}>
<h1>{data.name}</h1>
<p>{data.teamId}</p>
</li>
)
})}
</ul>
</div>
</div>
)
}
You can pass data like this to navigated component您可以将这样的数据传递给导航组件
const openTeam = (data) => {
this.props.history.push({
pathname: '/',
state: { passedData: data }
})
}
and access like this并像这样访问
this.props.location.state.passedData
Or or similarly for the Link
component或者或类似地用于
Link
组件
<Link to={{
pathname: '/',
state: {passedData: data}
}}> {data.name} </Link>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.