javascript - 如何将 tabBarOption 添加到下面的代码中?这样我就可以使用 tintColor

标签 javascript reactjs react-native mobile error-handling

如何将选项卡栏选项添加到下面的代码中,并同时使用色调颜色。 我想对选项卡栏选项内的图标使用事件和非事件

import React from 'react'
import { SafeAreaView, Text } from 'react-native';
export default class Chat extends React.Component {
static navigationOptions = ({ navigation }) => {
    let tabBarIcon = () => {
        return <MaterialIcons
            style={{ backgroundColor: 'transparent' }}
            name={'chat'}
            color={'#000'}
            size={30}
        />
    }
    return { tabBarIcon }
}
render(){
    return(
        <SafeAreaView>
            <Text>Chat</Text>
        </SafeAreaView>
    )
}

最佳答案

如官方site所述. tabBarIcon 是一个函数,它被赋予焦点状态、tintColor 和水平参数,这是一个 bool 值。

试试这个

static navigationOptions = ({ navigation }) => {
    let tabBarIcon = ({ focused, horizontal, tintColor }) => {
        return <MaterialIcons
            style={{ backgroundColor: 'transparent' }}
            name={'chat'}
            color={tintColor}
            size={30}
        />
    }
    return { tabBarIcon }
}

关于javascript - 如何将 tabBarOption 添加到下面的代码中?这样我就可以使用 tintColor,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57934864/

相关文章:

react-native - 使用 React Native 时关闭 iPhone 模拟器上的应用程序的可靠方法

javascript - 突出显示图像 map 上的区域

javascript - 可折叠 DIV - 它可以使 BOX 打开得更宽吗?

javascript - 是否可以使用 JavaScript 写入文件(在磁盘上)?

javascript - react : passing mapped data from button onclick to display on another component

reactjs - 来自 material-ui 的 DataTables 分页不起作用

url - React 路由器未重定向到确切的 url

javascript - react Hook : State always setting back to initial value

android - 在网络浏览器中打开深度链接到 React-Native 应用程序

javascript - React Native 模态选择器中的全屏