反应导航+流星+ redux，不尊重或不应用导航选项

Question

我有问题，这是我的代码：

import React, { Component } from 'react';
import Meteor, {
  withTracker,
} from 'react-native-meteor'
import { connect } from 'react-redux';
class CreateCommunityContainer extends React.Component{

   static navigationOptions = {
       title: 'Community',
       headerRight: (
            <TouchableOpacity onPress={() => {
                this.testFunction(par);
            }}>
                <View style={{marginRight:5}}>
                   <Text>NEXT</Text>
                </View>
            </TouchableOpacity>),
    };

    testFunction(par){
    ... some code
    }

    render(){
        ...some code
    }

}

const CreateCommunityMeteor = withTracker(({userId}) => {
   ...some code         
})(CreateCommunityContainer);

export default connect(mapStateToProps, mapDispatchToProps)(CreateCommunityMeteor);

我的问题是为什么不尊重或不应用 navigationOption，我希望 navigationOption 在 header 栏中给我标题 "Community" 但事实并非如此。但如果我把它放在导航路由器中，它会像往常一样工作，以及如何让它生效。顺便说一句，我需要在屏幕 class 中而不是在路由器中定义 navigationOption，所以我可以在 class 中从 header 反应导航的右组件调用函数。

Answer 1

既然你已经提到如果没有 withTracker meteor 函数你的组件会按预期运行，我认为问题在于 withTracker 没有将静态属性引入新组件它创造了。

您可以尝试在 CreateCommunityMeteor 组件上设置 navigationOptions 属性：

const CreateCommunityMeteor = ...

CreateCommunityMeteor.navigationOptions = {
    ...
};

export default connect(...)

我还注意到您在静态函数中调用 this - 这不会起作用，因为静态函数无法访问 class 实例。

同样，我建议的静态函数也无法访问它。

为了解决这个问题，你可以将navigationOptions设置为一个函数：({navigation}) => {...}并将你需要的作为参数传递给路由。

反应导航+流星+ redux，不尊重或不应用导航选项

react navigation + meteor + redux, navigationOption not respected or not applied

meteor

react-native

react-redux

react-navigation