标题按钮内部自定义函数反应原生

  • Z时代
  • 2024-01-10
  • 分类：问答

我想在我的反应导航标题中调用自定义按钮内的自定义函数。我看着周围的几个方法可以做到这一点，我已经找到了最好的结果是使功能静态的，那就是：但是标题按钮内部自定义函数反应原生

export class MyClass extends React.Component{ 
    static navigationOptions = ({navigation}) => ({ 
     headerRight: (<Button title='press me' onPress={()=> MyClass.SomeFunction() } ></Button>) 
    }); 
    static SomeFunction(){ 
     /*Some code here*/ 
    } 
    /*Some extra code here*/ 
}

我的问题是，我需要内部访问一些国家性质SomeFunction()，如您所知，您无法在静态函数中访问this。

有没有什么办法可以访问一个静态内的组件的状态，还是有一个更好的方法来实现一个自定义函数在一个按钮中的头？

回答：

作为替代解决方案，您可以设置导航器状态以设置和获取值。

如果使用AppWithNavigation状态父为您的导航结构的根，你应该是一个navigation道具传递给子元素象下面这样：

render() { 
    const { dispatch, nav, } = this.props 
    return (
     <AppNavigator 
      navigation={addNavigationHelpers({ 
       dispatch: dispatch, 
       state: nav, 
      })} 
     /> 
    ) 
}

如果是这样，只需使用下面的行设置你的价值观：

this.props.navigation.state.someValue
： 

this.props.navigation.setParams({someValue: 'Value'})

每当你想要像下面然后让你的设定值

或者

const { someValue } = this.props.navigation.state

但请记住，当第一次呈现组件的状态可以为空或未定义。所以，你需要检查其现有之前尝试获得：

if (!this.props.navigation.state) { 
    return null 
} 
const someValue = this.navigation.state.someValue 
if (someValue) { 
    /* you can use your someValue here! */ 
}

注到每个航线都有自己的状态对象。当你的屏幕被改变时，你的this.props.navigation.state对象的状态被改变。如果您需要全球解决方案，我认为您可以使用Redux。

回答：

经过一段时间的代码搞乱之后，我发现了一个更适合我需求的解决方案。我将它张贴在下面以防万一。谢谢大家的贡献：D

export class MyClass extends React.Component{ 
    static navigationOption = ({navigation}) => ({ 
     headerRight: (<Button title='Press Me!' onPress={() => MyClass.SomeFunc() }) 
    }) 
    //The function 
    static SomeFun(){ 
     alert(MyClass.SomeState.abc) 
    } 
    //Static functioning as state 
    static SomeState = { 
     abc: 'def' 
    } 
}

以上是 标题按钮内部自定义函数反应原生 的全部内容， 来源链接： utcz.com/qa/261000.html

回到顶部