Picker.Item 颜色在本机反应中不起作用

Question

我是react-native 的新手。我一直在尝试通过简单的颜色更改来自定义Picker.Item，但它不起作用。

我创建了一个RedPickerItem 类，它包装Picker.Item，默认color 设置为red。

class RedPickerItem extends Component{
    render(){
        return(
            <Picker.Item color="red" {...this.props}/>
        )
    }
}

我像下面这样使用它

<Picker
    selectedValue={this.state.pickerValue}
    style={{height: 50, width:'100%'}}
    onValueChange={(itemValue, itemIndex) => this.setState({pickerValue: itemValue})}>
    <RedPickerItem label="Red Picker Item" value="red"/>
    <Picker.Item label="Default Picker Item" value="default"/>
</Picker>

但低于显示默认Picker.Item 颜色的输出。给定的红色不起作用。

当我像这样直接给color 道具时

<Picker.Item color="red" label="Red Picker Item" value="red"/>

有效。

但这不是我想要的工作方式。我想要包装 method 工作。

完整源代码

import React, {Component} from 'react';
import {Picker, View} from 'react-native';

type Props = {};
export default class App extends Component<Props> {

    constructor(props) {
        super(props);
        this.state = {
            pickerValue: ''
        }
    }

    render() {
        return (
            <View>
                <Picker
                    selectedValue={this.state.pickerValue}
                    style={{height: 50, width:'100%'}}
                    onValueChange={(itemValue, itemIndex) => this.setState({pickerValue: itemValue})}>
                    <RedPickerItem label="Red Picker Item" value="red"/>
                    <Picker.Item label="Default Picker Item" value="default"/>
                </Picker>
            </View>
        );
    }
}

class RedPickerItem extends Component{
    render(){
        return(
            <Picker.Item {...this.props} color="red" />
        )
    }
}

编辑：

我知道 'Picker' 有这个 'itemStyle' 属性，但我需要为每个 Picker.Item 设置单独的项目颜色集。

所以我的问题是，

1) 为什么当我用另一个类包装它时它不起作用？

2) 我怎样才能让它工作？

可以在 cmets 中询问进一步的说明。

Answer 1

<Picker.Item color='#000'
   label={Platform.OS === 'ios'?<Text style={{color:'#000'}}>{label}</Text>:label}
   value='' />