headerLeft 在reactNavigation V3 中不起作用

Question

我已经检查了以前的答案并尝试了不同的方法，但仍然不起作用。仅当我在屏幕内使用静态导航选项时它才有效

我尝试使用defaultNavigationOptions，但不起作用，其上的navigationOptions也不起作用

TIMETABLE = createStackNavigator(
    {
        timetable: {
            screen: timetable,
            defaultNavigationOptions: {
                title: i18n.t('TIMETABLE'),
                headerStyle,
                headerTitleStyle,
                headerLeft: (
                    <Button
                        title="oi"
                        color="#fff"
                    />
                )
            }
        }
    }
);

the above does not work and neither the below code: 

TIMETABLE = createStackNavigator(
    {
        timetable: {
            screen: timetable,
            navigationOptions: {
                title: i18n.t('TIMETABLE'),
                headerStyle,
                headerTitleStyle,
                headerLeft: (
                    <Button
                        title="oi"
                        color="#fff"
                    />
                )
            }
        }
    }
);

期望在堆栈导航器标题左侧看到一个标题为“oi”的按钮，但没有出现任何按钮。

Answer 1

不是因为你的

button

背景是白色的吗？

               navigationOptions: {
                title: i18n.t('TIMETABLE'),
                headerLeft: (
                  <View style={{paddingLeft: 20}}>
                    <Button
                        title="oi"
                        color="black"
                    />
                    </View>
                )
            }

按钮执行示例

Answer 2

这样做

          headerLeft: () => (
            <Text style={{color: '#000', fontSize: 18}}>Hey There</Text>
          ),
          headerLeftContainerStyle: {backgroundColor: '#fff'},

或者，

          headerLeft: () =>{return (
            <Text style={{color: '#000', fontSize: 18}}>Hey There</Text>
          )},
          headerLeftContainerStyle: {backgroundColor: '#fff'},