如何在ReactJS中获取我的子元素的状态？

我想知道我怎样才能在这种情况下，我的子元素的状态，请如何在ReactJS中获取我的子元素的状态？

class Child extends React.Component{ 

    constructor(props){ 
     super(props) 

     this.state = { 
      element : "I NEED THIS STATE" 
     } 

    } 

    render(){ 
     return <h1>Hello</h1> 
    } 
} 

class Main extends React.Component{ 
    render(){ 
     return(
      <div> 
       <Child /> 
      </div> 
     ) 
    } 
}

来源

2017-03-04 Orlando Andaur

请详细说明一下你为什么需要这个。你在努力达到什么目标？ –

如果我理解你，你需要在主要成分的状态。

class Child extends React.Component{ 

    constructor(props){ 
     super(props) 

     this.state = { 
      element : "I NEED THIS STATE" 
     } 

    } 

    render(){ 
     this.props.checkStatus(this.state.element); 
     return <h1>Hello</h1> 
    } 
} 

class Main extends React.Component{ 
getChildStatus(status){ 
    console.log(status) 
} 
render(){ 
    return(
     <div> 
      <Child checkStatus={this.getChildStatus}/> 
     </div> 
    ) 
}

}

正如费利克斯说，我们与平时像的onClick或部分的onChange事件时使用的道具扔功能。像return <h1 onClick={this.props.checkStatus(this.state.element)}>Hello</h1>

来源

2017-03-04 17:41:12 Andrew

虽然在'render（）'函数中调用'this.props.checkStatus（this.state.element）''有点奇怪。 –

@Felix我不知道他可以检查这个状态，所以我这样做了。 – Andrew

或者你的意思是，我应该调用函数作为回报？ – Andrew

简单的东西使它工作，你可以做到这一点@Andrew暗示的方式。但是，我强烈建议阻止你这样做，除非你真的知道你在做什么。

React鼓励单向数据流有助于让您的代码更易于推理。拇指方法的规则可以高达简化为道具下来，事件。

数据由父母传递到使用props（只读防止孩子从父母突变是偶然的state）的孩子。

活动儿童冒泡通知其父发生了什么。（典型地，通过调用在孩子的事件处理程序的父传递函数/回调props）

在反应的组分体系中，两个父母和孩子已经分离作用域。这意味着家长应该不知道它的孩子（包括你的情况state）知识，孩子们只能通过props读父的数据。为了更改状态以触发UI刷新，this.setState()是您的朋友，通常用于事件处理程序/服务器请求回调。

推荐阅读：https://facebook.github.io/react/docs/thinking-in-react.html

_{顺便说一句。 React的声明性组件组合本质上是函数组合。你的问题类似于“我可以在声明的函数中获取闭包的局部变量”，显然，你可以这样做，但是你必须问自己为什么要这样做来打破封装。}

来源

2017-03-04 18:37:53 Xlee

如何在ReactJS中获取我的子元素的状态？

回答

相关问题