React Native Picker占位符文本被剪切

Question

图片不仅仅是文字：

Picker项目的原始标签是“WEEEEEEK”。我不明白为什么Picker组件会裁剪文本，尽管仍然有至少4个字符的空间。

以下是代码示例：

<View style={{flex: 0.25}}>
                <View style={s.calendarFilterContainer}>
                    <Picker
                        style={{ height: 30 }}
                        mode="dropdown"
                        placeholder={t('common:filterPlaceholder')}
                        selectedValue={selectedValue}
                        onValueChange={(value) => this.onValueChange(value)}
                        headerBackButtonText={t('common:back')}
                    >
                        <Item label={'Day'.toUpperCase()} value="day" />
                        <Item label={'Weeeeeeek'.toUpperCase()} value="week" />
                        <Item label={'All'.toUpperCase()} value="all" />
                        <Item label={'To do'.toUpperCase()} value="todo" />
                    </Picker>
                </View>
            </View>

const s = StyleSheet.create({
    calendarFilterContainer: {
        alignSelf: 'flex-end',
        width: 130,
        borderWidth: 2,
        borderColor: C.COLOR_THEME,
        backgroundColor: 'white',
        borderRadius: 10,
        marginRight: 10,
    },
});

即使设置较大的宽度，也不会显示全文。

Answer 1

更改选择器样式道具中的宽度而不是视图的样式道具

                  <Picker
                    style={{ height: 30 , width:'30%'}}
                    mode="dropdown"
                    placeholder={t('common:filterPlaceholder')}
                    selectedValue={selectedValue}
                    onValueChange={(value) => this.onValueChange(value)}
                    headerBackButtonText={t('common:back')}
                   >
                    <Item label={'Day'.toUpperCase()} value="day" />
                    <Item label={'Weeeeeeek'.toUpperCase()} value="week" />
                    <Item label={'All'.toUpperCase()} value="all" />
                    <Item label={'To do'.toUpperCase()} value="todo" />
                </Picker>