React native 呈现子组件或调用子组件'；来自父组件的方法，反之亦然[React Native]

我试图在从父组件下拉刷新时重新渲染子组件，但不知道如何执行此操作。以下是我目前代码中的内容

来自家长：

OnRefresh = () => {
    this.setState({refresh: true});
    // call function loadTaskListing() from child component
    this.setState({refresh: false});
}

render() {
    return (
        <View>
            <ScrollView refreshControl={<RefreshControl refreshing={this.state.refresh} onRefresh={this.OnRefresh} />}>
                <TaskListing navigation={this.props.navigation} />
            </ScrollView>
        </View>
    )
}

OnRefresh=（）=>{
this.setState（{refresh:true}）；
//从子组件调用函数loadTaskListing（）
this.setState（{refresh:false}）；
}
render（）{
返回(
)
}

从子级（任务列表）：

LoadTaskList（用户ID）{
//从服务器端获取数据
}
render（）{
返回(
{/*列表视图位于此处*/}
)
}

---

根据我上面的代码，刷新控件来自父视图，但我要重新加载的函数来自子视图。如何从child触发函数并返回到parent以刷新？

您可以使用

ref

在parent中调用child的方法

OnRefresh = () => {
    this.setState({refresh: true});
    // call method of child component using ref
     this.taskListRef.loadTaskListing();
}

refreshDone =()=>{
  this.setState({refresh: false});
}

render() {
    return (
        <View>
            <ScrollView refreshControl={<RefreshControl refreshing={this.state.refresh} onRefresh={this.OnRefresh} />}>
                <TaskListing 
                   ref={instance=>this.taskListRef = instance} // ref assigning 
                   navigation={this.props.navigation}
                   refreshDone={this.refreshDone}
                />
            </ScrollView>
        </View>
    )
}

OnRefresh=（）=>{
this.setState（{refresh:true}）；
//使用ref调用子组件的方法
this.taskListRef.loadTaskListing（）；
}
刷新完成=（）=>{
this.setState（{refresh:false}）；
}
render（）{
返回(
this.taskListRef=instance}//ref分配
导航={this.props.navigation}
refreshDone={this.refreshDone}
/>
)
}

---

当您想停止刷新时，在child中调用

this.props.refreshDone（）

。

很好的解决方案。非常感谢。

OnRefresh = () => {
    this.setState({refresh: true});
    // call method of child component using ref
     this.taskListRef.loadTaskListing();
}

refreshDone =()=>{
  this.setState({refresh: false});
}

render() {
    return (
        <View>
            <ScrollView refreshControl={<RefreshControl refreshing={this.state.refresh} onRefresh={this.OnRefresh} />}>
                <TaskListing 
                   ref={instance=>this.taskListRef = instance} // ref assigning 
                   navigation={this.props.navigation}
                   refreshDone={this.refreshDone}
                />
            </ScrollView>
        </View>
    )
}