react-native - React Native SwitchSelector 在选择时更改图标颜色

Question

import React from "react";
import { StatusBar, StyleSheet } from "react-native";
import { Fontisto } from "@expo/vector-icons";
import SwitchSelector from "react-native-switch-selector";

const options = [
  { label: "M", value: "M", customIcon: <Fontisto name="male" size={20} /> },
  { label: "F", value: "F", customIcon: <Fontisto name="female" size={20} /> },
];
<SwitchSelector
  options={options}
  initial={0}
  selectedColor={"#ffffff"}
  borderColor={"#cccccc"}
  buttonColor={"#539670"}
  onPress={(value) => console.log(`Call onPress with value: ${value}`)}
  selectedTextContainerStyle={{ color: "#ffffff" }}
  borderWidth="2"
/>;

以上代码未在选项选择上更新图标颜色需要更改图标颜色文本颜色更改工作但图标颜色未更新。

标签： react-native

Answer 1

<SwitchSelector
          // textColor="red"
          selectedColor="yellow"
          buttonColor="#800000"
          borderColor="blue"
          hasPadding
          
          initial={0}
          borderRadius={20}
          //onPress={value => setGender({gender: value})}
          //options={genderOptions}
          options={[
            {
              label: 'Male',
              value: 'm',
              imageIcon: require('../images/male.png'),
            },
            {
              label: 'FeMale',
              value: 'f',
              imageIcon: require('../images/female.png'),
            },
          ]}
        />