Question

因此，我现在已经处理了好几天的问题，并且一直在大量搜索并尝试实施解决方案。大多数解决方案建议使用 this.props.navigation.setParams({function: this.function.bind(this))内的componentDidMount，然后在navigationOptions->

中执行类似的操作

static navigationOptions = {
header:  ({navigation})  => 
   <Button onPress = { () => navigation.state.params.function}/> }

这适用于onPress的按钮，但当它只是自定义组件的“道具”时，此方法似乎不起作用。

这是我的代码

static navigationOptions = {
header:  ({navigation})  => 
   <CustomCar refreshCar = {navigation.state.params.refreshCarSearch}
   />

transitionConfig: () => ({
  transitionSpec: {
    duration: 0,
    timing: Animated.timing,
    easing: Easing.step0,
  },
}),
};

constructor(props) {
    super(props)
    this.state =  {
      Car: ' '
    }
    this.refreshCarSearch = this.refreshCarSearch.bind(this);
}

componentDidMount() {
this.props.navigation.setParams({ refreshCarSearch: this.refreshCarSearch });
               }

refreshCarSearch(e){
    this.setState({
        Car: e
        });
                }

我总是得到navigation.state.params.refreshCarSearch是未定义的。我已经尝试了这种方法的许多变体，但无济于事。仅当我使用onPress用按钮替换组件时，此方法才有效，但是我需要将此函数传递过来。基本上，我需要让CustomCar组件（该组件必须位于屏幕顶部，因此在navigationOptions中）将值传递回此Component，以便可以进行refreshCarSearch。我读过的唯一方法是使用Redux或父组件将refreshCarSearch函数传递给“子”组件的情况。 navigationOptions中现有的组件使其变得更加困难，这可能吗？

Answer 1

如果您希望此客户Car组件位于屏幕顶部，则应在渲染功能的顶部调用此组件，然后您将获得refreshCarSarch this.props.navigation.state.params.refreshCarSearch 例如：

render(){
 return (
   <CustomCar refreshCar = {()=>this.props.navigation.state.params.refreshCarSearch()}
   />
)
}

Answer 2

考虑一个父组件，您要在道具上发送一个名为refreshCarSearch的函数，该函数在您的情况下不起作用。

<ParentComponent refreshCarSearch={this.refreshCarSearch}/>

因此，您必须像这样发送refreshCarSearch

<ParentComponent screenProps={{refreshCarSearch:this.refreshCarSearch}}/>

在子组件的navigationOptions中，您可以像这样访问它

static navigationOptions = ({navigation, screenProps}) {
header:  ()  => 
   <Button onPress = { () => screenProps && screenProps.refreshCarSearch}/> 
}

要在此处添加的另一件事是，我不确定标题上的参数是否返回导航对象，但是上面的参数返回导航和screenProps对象（navigationOptions静态方法参数）。

希望对您有帮助。

如何将组件的功能传递给NavigationOptions内部的组件

2 个答案: