为什么我的函数在 React Native 中仍然是 return promise

Question

我获取值的函数正在返回一个我不知道如何等待解决的承诺。我失败的代码：

const [rednderSaves, setRenderSaves] = React.useState([])
  const saveRenders = async () => {
    var data = await JSON.parse(await AsyncStorage.getItem("connections"))
    for (var i = 0; i < data.length; i++) {
      data[i].data = await JSON.parse(await data[i].data)
    }
    setRenderSaves(data)
  }
{saveRenders().then(rednderSaves.map(save => {
                return <Text key={Date.now()}>{save.name}</Text>
}))}

这个过于复杂的事情仍然RETURNS一个承诺。在过去的 4 个小时里，我一直在摸不着头脑，请终于有人帮忙了。提前致谢

Answer 1

试试这个

const [rednderSaves, setRenderSaves] = React.useState([])
  React.useEffect(()=>{
    saveRenders() 
  },[])
  const saveRenders = async () => {
    var data = await JSON.parse(await AsyncStorage.getItem("connections"))
    for (var i = 0; i < data.length; i++) {
      data[i].data = await JSON.parse(await data[i].data)
    }
    setRenderSaves(data)
  }
   return (
    <>
     {
      rednderSaves.length?rednderSaves.map(save => (
       <Text key={Date.now()}>{save.name}</Text>
      )):
     null
     }
    </>
)

Answer 2

链接then总是returns另一个承诺。正确的方法是在 useEffect 生命周期正确加载数据。

const [renderSaves, setRenderSaves] = React.useState([])
  React.useEffect(() => {
    const saveRenders = async () => {
      const data = JSON.parse(await AsyncStorage.getItem("connections"))
      for (let i = 0; i < data.length; i++) {
        data[i].data = JSON.parse(data[i].data)
      }
      setRenderSaves(data)
    }

    saveRenders()
  }, [])
  
  return (
    <>
      // ... content
      { renderSaves.map(save => <Text key={Date.now()}>{save.name}</Text>) }
    </>
  )

为什么我的函数在 React Native 中仍然是 return promise

Why does my function still return a promisse in react native

reactjs

react-native

asyncstorage