反应本机后退按钮缺少图标 [英] React native back button missing icon

查看:31
本文介绍了反应本机后退按钮缺少图标的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 react-navigation 组件为现有的移动应用开发 React Native 模块:

I'm developing a react native module for an existing mobile app, using react-navigation component:

import { StackNavigator } from 'react-navigation';
....

const App = StackNavigator({
    Main: {
        screen: Main,
        navigationOptions: {
            headerBackTitle: null,
        }
    },
    Details: {
        screen: Details,
        navigationOptions: {
           headerBackTitle: null,
        }
    }

});

在主索引中,我渲染了一个简单的按钮,点击后可以执行此操作:

In Main index I render a simple button that on click do this:

render() {

        const navigation = this.props.navigation;

        return (
            <View>
                <Button
                    title="Go to details"
                    onPress={() => { navigation.navigate("Details") }}
                />
            </View>
        );
    }

就是这样.

问题是导航返回按钮不可见(见图):

The issue is that the navigation back button is invisible (see image):

此操作后发生这种情况:

This happen after this operations:

  • 在android项目中复制bundle.

  • Copying bundle in android project .

react-native bundle --platform android \
--dev false --entry-file index.js 
--bundle-output ../MyApp/app/src/main/assets/index.android.bundle \
--assets-dest ../MyApp/app/src/main/  

  • 从 Android Studio 启动应用

  • Launching app from Android studio

    有什么建议吗?

    推荐答案

    navigationOptions: ({ navigation }) => ({
          headerLeft: drawerButton(navigation)
    })
    
    const drawerButton = navigation => (
        <TouchableOpacity onPress={() => navigation.navigate("DrawerToggle")}>
            <Image source={Your.image} style={Your.Style} />
        </TouchableOpacity>
    );
    

    使用此代码!

    这篇关于反应本机后退按钮缺少图标的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

  • 查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆