react-native-picker/picker未正确呈现任何选择器选项

yyhrrdl8 于 2023-06-30 发布在 React

关注(0)|答案(1)|浏览(154)

我正在开发一个react native应用程序。我目前想将react-native-picker/picker添加到我的应用程序中，以便允许用户滚动并选择priceMin值的选项。我安装了picker，并按照github repo的说明操作。
它不显示任何选项。
下面是我的代码片段：

<View style={styles.detailRow}>
            <View>
              <Text style={styles.detailSection}>Price Min: </Text>
            </View>
            <Picker 
              selectedValue={priceMin}
              onValueChange={(itemValue, itemIndex) =>
                setPriceMin(itemValue)
              }
              style={styles.detailInput}
            >
              <Picker.Item label='Any' value={null} />
              <Picker.Item label='50K' value={50000} />
              <Picker.Item label='100K' value={100000} />
              <Picker.Item label='150K' value={150000} />
              <Picker.Item label='200K' value={200000} />
              <Picker.Item label='250K' value={250000} />
              <Picker.Item label='300K' value={300000} />
              <Picker.Item label='350K' value={350000} />
              <Picker.Item label='400K' value={400000} />
              <Picker.Item label='450K' value={450000} />
              <Picker.Item label='500K' value={500000} />
              <Picker.Item label='600K' value={600000} />
              <Picker.Item label='700K' value={700000} />
              <Picker.Item label='800K' value={800000} />
              <Picker.Item label='900K' value={900000} />
              <Picker.Item label='1M' value={1000000} />
              <Picker.Item label='2M' value={2000000} />
              <Picker.Item label='2.5M' value={2500000} />
              <Picker.Item label='3M' value={3000000} />
              <Picker.Item label='3.5M' value={3500000} />
              <Picker.Item label='4M' value={4000000} />
              <Picker.Item label='4.5M' value={4500000} />
              <Picker.Item label='5M' value={5000000} />
              <Picker.Item label='6M' value={6000000} />
              <Picker.Item label='7M' value={7000000} />
              <Picker.Item label='8M' value={8000000} />
              <Picker.Item label='9M' value={9000000} />
              <Picker.Item label='10M' value={10000000} />
              <Picker.Item label='11M+' value={11000000} />
            </Picker>
          </View>

现在它显示了这个：

我现在正在运行这个版本："@react-native-picker/picker": "2.4.8"

react-native

来源：https://stackoverflow.com/questions/76578042/react-native-picker-picker-is-not-rendering-any-picker-options-correctly

1条答案

按热度按时间

nukf8bse1#

我已经检查了你的代码选择器视图和它的罚款。可能是你的风格问题。
在这里，我检查了你的代码实现我的风格和我的作品很好，请检查所附的代码和截图。

import React, {useState} from 'react';
import {SafeAreaView, StyleSheet, Text, View} from 'react-native';

import {Picker} from '@react-native-picker/picker';

const App = props => {
  const [priceMin, setPriceMin] = useState(250000);

  return (
    <SafeAreaView style={styles.app}>
      <View>
        <Text style={{fontSize: 20, marginLeft: 4}}>Price Min: </Text>
      </View>
      <Picker
        selectedValue={priceMin}
        onValueChange={(itemValue, itemIndex) => setPriceMin(itemValue)}>
        <Picker.Item label="Any" value={null} />
        <Picker.Item label="50K" value={50000} />
        <Picker.Item label="100K" value={100000} />
        <Picker.Item label="150K" value={150000} />
        <Picker.Item label="200K" value={200000} />
        <Picker.Item label="250K" value={250000} />
        <Picker.Item label="300K" value={300000} />
        <Picker.Item label="350K" value={350000} />
        <Picker.Item label="400K" value={400000} />
        <Picker.Item label="450K" value={450000} />
        <Picker.Item label="500K" value={500000} />
        <Picker.Item label="600K" value={600000} />
        <Picker.Item label="700K" value={700000} />
        <Picker.Item label="800K" value={800000} />
        <Picker.Item label="900K" value={900000} />
        <Picker.Item label="1M" value={1000000} />
        <Picker.Item label="2M" value={2000000} />
        <Picker.Item label="2.5M" value={2500000} />
        <Picker.Item label="3M" value={3000000} />
        <Picker.Item label="3.5M" value={3500000} />
        <Picker.Item label="4M" value={4000000} />
        <Picker.Item label="4.5M" value={4500000} />
        <Picker.Item label="5M" value={5000000} />
        <Picker.Item label="6M" value={6000000} />
        <Picker.Item label="7M" value={7000000} />
        <Picker.Item label="8M" value={8000000} />
        <Picker.Item label="9M" value={9000000} />
        <Picker.Item label="10M" value={10000000} />
        <Picker.Item label="11M+" value={11000000} />
      </Picker>
    </SafeAreaView>
  );
};
const styles = StyleSheet.create({
  app: {
    flex: 1,
  },
});

export default App;

赞(0）回复(0）举报 2023-06-30

我来回答

react-native-picker/picker未正确呈现任何选择器选项

1条答案

相关问题

热门标签

最新问答