时间戳

首页 > 解决方案 > React > expo > Axio > Async 不要等待响应

reactjs - React > expo > Axio > Async 不要等待响应

问题描述

我是世博会的一个真正的假人并做出反应。我正在尝试使用 AXIO 获取信息 API。

我的问题是，在 API 请求完成之前，expo 要求返回语句。

这是我的代码：

const sendGetRequest = async () => {
  try {
      const resp = await axios.get(uri, {
        auth: {
        username: '*****',
        password: '****'
      }})
      console.log(resp.data);
      return (
        <View style={styles.container}>
          <Text style={styles.title}>Action</Text>
          <View style={styles.separator} lightColor="#eee" darkColor="rgba(255,255,255,0.1)" />
          <Text>
              Order ID: {resp.data.id}
              Nom client: {resp.data.billing.first_name} {resp.data.billing.last_name}
            </Text>
          <EditScreenInfo path="/screens/TabTwoScreen.tsx" />
        </View>
      );

      

  } catch (err) {
      // Handle Error Here
      console.error(err);
  }
};

sendGetRequest();

我得到这个错误：

“渲染没有返回任何东西”

我猜 await 并不是真的在等待异步的结果。

你能帮我看看我的错误在哪里？？？

非常感谢..

问候，

皮埃尔

标签： reactjsexpo

解决方案

好的，我找到了解决问题的方法。我花了几分钟有用的时间来阅读有关承诺和回调的更多信息。我错误地认为承诺将保留代码直到它得到响应。当您了解承诺一旦意识到正确的代码后发送回调时，代码如下：

        // Creating a "DOM listener" -> sorry about vocabulary
        const [myText, setMyText] = useState("My Original Text");
    
        // Creating the async/awaiting function
        const sendGetRequest = async () => {
      try {
          var resp = await axios.get(uri, {
            auth: {
            username: '*******',
            password: '*******'
          }});
          await setMyText('Nom du client:'+ resp.data.billing.first_name);
    
      } catch (err) {
          // Handle Error Here
          console.error(err);
      }
    };
    
    sendGetRequest();

// AND RETURN THE HTML AS FOLLOW
        <View>
            <Text onPress = {() => setMyText("My Changed Text")}>
                    {myText}
            </Text>
        </View>

推荐阅读