选择器问题的解决方案出现加载，如何解决？答案

【问题标题】：The solution for the picker issue appears loading, how to fix it?选择器问题的解决方案出现加载，如何解决？
【发布时间】：2022-09-29 11:31:06
【问题描述】：

那是我在上一个问题中修复的代码，但仍然出现错误，数据不显示只是显示加载，如何解决？

const Sub_Map = () => { 
    const [hasLoaded, setHasLoaded] = useState(false);
    const [data, setdata] = useState();

useEffect(() => {
    const callApi = async () => {
      await getData();
      setHasLoaded(true);
    };
    callApi();
  }, []);

  const getData = () => {
    fetch(\'http:// . . . ./aplikasi/restapi.php?op=getJenis\')
      .then(response => response.json())
      .then(json => {
        // console.log(json);
        setdata(json);
        // console.log(data);
      });
  };

也许返回部分还有另一个更正？

return (
    <View style={styles.container}>
      <Text style={styles.text}>Pilih Data</Text>
      <View style={styles.picker}>
        {hasLoaded ? (
          <ActivityIndicator />
        ) : (
          <Picker
            selectedValue={data}
            onValueChange={itemValue => setdata(itemValue)}>
            {data &&
              data?.map((item, key) => {
                <Picker.Item
                  label={\'${item.bencana}\'}
                  value={\'${item.ID }\'}
                  key={key}
                />;
              })}
          </Picker>
        )}
      </View>
     );
    };

这是针对 API 的，可能会有更正

    function getJenis()
{
    global $conn;
    global $json;
    global $obj;

    $sql = mysqli_query($conn, \"SELECT * FROM bencana_detail ORDER BY bencana ASC\");

    while ($row = mysqli_fetch_array($sql)) {
        $hasil[] = array(
            \'ID\' => $row[\'id_bencana_detail\'],
            \'bencana\' => $row[\'bencana\']
        );
    }
    echo json_encode($hasil);
}

在获取数据之前，您的 ActivityIndicator 似乎不会显示，这是正确的吗？
是的，没错，数据没有出现，但是当console.log数据出现时
我的意思是ActivityIndicator 应该出现在数据被获取之前，一旦数据被加载，AcitivityIndicator 应该被移除并显示选择器。但是，您上面的代码在初始渲染中显示了空选择器，一旦加载数据，空选择器将隐藏并永远显示AcitivityIndicator。那是你要的吗？
其实不是，只是在选择器中显示数据
请在此处包含图片，而不是作为 Google 云端硬盘的链接

标签： android react-native picker

【解决方案1】：

试试这个它应该工作

{data.length <= 0 ? (
  <ActivityIndicator />
) : (
  <Picker
    selectedValue={data}
    onValueChange={itemValue => setdata(itemValue)}>
    {data &&
      data?.map((item, key) => {
        <Picker.Item
          label={'${item.bencana}'}
          value={'${item.ID }'}
          key={key}
        />;
      })}
  </Picker>
)}

【讨论】：