在React或React Native中，将颜色设置为SVG

Question

您可以设置通常会以十六进制颜色显示SVG的道具吗？在React Navigation中，活动背景（标签图标/文本后面的标签颜色）必须是SVG，而不是像这样的十六进制颜色：

tabBarOptions: {
    activeTintColor: colors.white,
    activeBackgroundColor: <SVG here>,
    inactiveTintColor: colors.primary.black,
    inactiveBackgroundColor: colors.white,
    labelStyle: {
        fontWeight: "bold",

    },
}

Answer 1

您可以使用react-native-svg-transformer将svg导入您的代码中。设置好之后，您就可以做到：

import Logo from "./logo.svg";

如果使用React Native 0.56或更早版本，则需要将.svg文件重命名为.svgx。