react-native:Modal 中的选择器未显示

Question

当我的 Picker 嵌入到 Modal 中时，它不会出现在屏幕上(仅针对 android 测试)

  renderModal() {
    return (
      <Modal
        transparent={true}
        visible={this.state.showModal}
        onRequestClose={() => this.setState({ modalIsVisible: false })}
        animationType={'fade'}>
        <View
          style={{ backgroundColor:'rgba(0, 0, 0, 0.7)', flex: 1, justifyContent: 'center', padding: 20, height:100 }}>
        <View style={{ borderRadius:10, alignItems: 'center', backgroundColor: '#fff', padding: 20 }}>
          <Text>
            Choisissez la priorité de cet emplacement
          </Text>
          <Picker
            selectedValue={this.state.storagePriority}
            onValueChange={(priority) => this.setState({storagePriority: priority})}>
            <Picker.Item label="Basse" value="LOW" />
            <Picker.Item label="Normale" value="MEDIAN" />
            <Picker.Item label="Haute" value="HIGH" />
            <Picker.Item label="Réserve" value="STOCK" />
          </Picker>
        </View>
        </View>
      </Modal>
    );
  }

有什么建议吗？

Answer 1

为选择器提供适当的样式并运行它。

这是样式选择器的示例代码。

    <Picker
        style={styles.picker}
        mode="dropdown"
        itemStyle={styles.itemStyle}>
            <Item label="Basse" value="LOW" />
            <Item label="Normale" value="MEDIAN" />
    </Picker>

样式:

itemStyle: {
    fontSize: 15,
    height: 75,
    color: 'black',
    textAlign: 'center',
    fontWeight: 'bold'
  }
picker: {
    width: 100
  },