Question

我在react-native中有一个Searchbar组件，它在父组件中导入，

SearchBar子组件具有以下元素：

         <Search
            ref={component => this._search = component}
            onChangeText={this.searchUpdated} 
            blurOnSubmit
            useClearButton={false}
            backgroundColor='#15A5E3'
          />
         searchUpdated(term) {
          return new Promise((resolve, reject) => {
          this.setState({ searchTerm: term });
          resolve();
         });
        }

是否可以在导入它的父级中访问此子组件的状态？在此先感谢帮助

Answer 1

您可以设置任何反应组件的'ref'prop，然后在Parent组件内部，您可以访问子项中的任何方法，如下所示：

this.refs.child.childMethod()

一个例子：

子组件

class ChildComponent extends Component {

   getState() {
    return this.state
   }

   render() {
    return <Text>I'm a child</Text>
   }
}

父组件：

class ParentComponent extends Component {

   manipulateChildState() {
    let child = this.refs.childRef.getState()
    // do something here
   }

   render() {
    return <Child ref='childRef' />
   }
}

请记住在this.refs.REFERENCE和prop ref ='REFERENCE'上使用相同的字符串

在react-native中访问父组件中的子组件状态

1 个答案: