reactjs - reactjs如何从其他组件更新状态?

  显示原文与译文双语对照的内容

我正在使用响应本机和响应导航的路由。

如何从其他组件/页更新状态?


HomeScreen 



export class HomeScreen extends Component {


 constructor(){


 this.state = {


 test: ''


 }


 }



 updateState = ()=>{


 this.setState({test:'new value'});


 }



 }



SideMenuScreen


import { HomeScreen } from"./home"; 



export class SideMenuScreen extends Component {



 updateHomeState = ()=>{


 let oHome = new HomeScreen(); 


 oHome.updateState();


 }



}

我的App.js 和路由和sidemenu配置如下:


import { createAppContainer, createDrawerNavigator } from"react-navigation";


import { SideMenuScreen } from"./screens/Sidemenu";


import { HomeScreen } from"./screens/Home";



export default class App extends Component {


 render() {


 return(


 <AppContainer></AppContainer>


 );


 }


}



const AppNavigator = createDrawerNavigator(


 {Home: HomeScreen, 


 other: otherpage},


 {


 contentComponent: SideMenuScreen


 }


);



const AppContainer = createAppContainer(AppNavigator);



执行但不更新状态的updateState 。

时间:

如果必须从子组件进行更新

要想更新状态的组件,你必须从组件中向下传递,子组件可以使用这些处理程序来更新英镑状态的状态。

如果你必须从其他位置更新

你必须在的状态下做一个英镑的工作,并且遵循上面的同样的步骤。

LevelUpComponent


export class App extends Component {


 constructor(){


 this.state = {


 test: ''


 }


 }



 updateState = (values)=>{


 this.setState(values);


 }



 render(){


 return <div>


 <HomeScreen></HomeScreen>


 <SideMenuScreen updateState={this.updateState}></SideMenuScreen>


 </div>


 }


 }



...