如何使用反应本机路由器流量在右侧按钮上添加图标

时间:2019-10-16 10:41:54

标签: react-native react-native-router-flux

我想使用反应本机路由器流量在标题中添加一个react-native-vector-icon代替右键

这是我的代码:

<Scene
    onRight={() => Actions.inbox()} 
    rightTitle='Inbox' 
    key='home'
    component={Home} 
    title='Home'
    icon={HomeIcon}
    initial
/> 

如何在其中添加react-native-vector-icon

2 个答案:

答案 0 :(得分:0)

您可以使用代替“ rightTitle”道具的方式:

  • 用于图像的“ rightButtonImage”道具
  • 用于自定义组件的“ renderRightButton”道具。

描述于:https://github.com/aksonov/react-native-router-flux/blob/master/docs/API.md#scene

答案 1 :(得分:0)

我明白了,我用renderRightButton来解决它。

这是示例:

const InboxIcon = () => {
    return (
        <View style={{ marginRight: 10 }} >
            <TouchableOpacity onPress={() => Actions.inbox()} >
                <Icon
                    name='comment'
                    type='font-awesome'
                    size={30}
                />
            </TouchableOpacity>
        </View>
    );
};

然后在场景中渲染它。像这样

<Scene
        renderRightButton={InboxIcon}  
        key='home'
        component={Home} 
        title='Home'
        icon={HomeIcon}
        initial
    />