[英]I need to pass a variable from one component to another
I have a plugin called form
in which I get two data val1
and val2
and this is passed to a plugin called route
and this must be passed to the game
plugin, my variables reach the parent but then I can't pass it to the child plugin called game.我有一个名为
form
的插件,在其中我得到两个数据val1
和val2
,这被传递给一个名为route
的插件,这必须传递给game
插件,我的变量到达父级但我不能将它传递给子级插件叫游戏。 Please help me or give me some guides to do it.请帮助我或给我一些指导。
The variable var1
is that I rescue and I must pass to the game.变量
var1
是我救的,我必须传递给游戏。
class Routes extends React.Component {
constructor(props) {
super(props);
this.state = {}
this.localVar1 = "";
}
datosDeFormInicio = (var1,var2) =>{
this.localVar1 = var1;
}
render() {
return (
<Router>
<Switch>
<Route path="/juego">
<Juego localVar1={this.localVar1} />
</Route>
<Route path="/">
<Inicio datosDeFormInicio = {this.datosDeFormInicio}/>
</Route>
</Switch>
</Router> );
}
}
export default Routes;
In Reactjs, you can use redux to pass a value to other components, It's state management in Reactjs.在 Reactjs 中,可以使用 redux 向其他组件传递一个值,在 ZFCE39BEF5E2EA931586B6A985A6942EF573EZ 管理中 ZFCE39BEF5E4BD9F39638 However, you can use
https://github.com/facebookarchive/emitter
for simple.但是,您可以简单地使用
https://github.com/facebookarchive/emitter
。
You'll need to use state instead of that variable.您需要使用 state 而不是该变量。 You'll need to add localVar1 to the state object you have
this.state{localVar1: ""};
您需要将 localVar1 添加到 state object 您有
this.state{localVar1: ""};
You'll need to use this.setState()
in datosDeFormInicio()
您需要在
this.setState()
中使用 this.setState datosDeFormInicio()
datosDeFormInicio = (var1,var2) =>{
this.setState(localVar1: var1);
}
Usually, I would call this function setLocalVar1, but it's just a naming convention.通常,我会将此称为 function setLocalVar1,但这只是一个命名约定。
To lightly explain why yours won't work: it has to do with the order that React updates components, and setState()
triggers the parent component to rerender, which is why you won't directly assign an object to the state variable简单解释一下为什么你的不起作用:它与 React 更新组件的顺序有关,并且
setState()
触发父组件重新渲染,这就是为什么你不会直接将 object 分配给 state 变量的原因
( this.state.localVar1 = someVar
also doesn't trigger the rerender`) (
this.state.localVar1 = someVar
也不会触发重新渲染`)
Here is the link to setState in the React docs, for a more detailed explanation: https://reactjs.org/docs/react-component.html#setstate这是 React 文档中 setState 的链接,以获得更详细的说明: https://reactjs.org/docs/react-component.html#setstate
thank you very much for the answer, I followed the steps using a state, but still it does not pass me the localVar variables in the component Juego, the empty variables arrive.非常感谢您的回答,我按照步骤使用 state,但仍然没有将组件 Juego 中的 localVar 变量传递给我,空变量到达。 This is the code you make.
这是您编写的代码。
constructor(props) {
super(props);
this.state = {localVar:'',localVar2:''}
}
datosDeFormInicio = (var1,var2) =>{
this.setState({localVar: var1,localVar2:var2});
}
render() {
return (
<Router>
<Switch>
<Route path="/juego">
<Juego localVar={this.state.localVar} localVar2={this.state.localVar2} />
</Route>
<Route path="/">
<Inicio datosDeFormInicio = {this.datosDeFormInicio}/>
</Route>
</Switch>
</Router> );
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.