log axios response.data 导致本机应用程序崩溃

Question

如果使用 returns JSON 的 URL 一切正常，例如 https://learn-numbers.herokuapp.com/v2/words/6788/English.
但我正在尝试从任何 URL 加载 HTML 内容我会说这是不可能的，但 Axios-hook 工作正常只是我不想使用它，因为它在请求重定向链接而不是错误时使应用程序崩溃。而不是用状态捕获错误。

现在，是否请求 Api 替代方案？ 可以解决问题

代码有什么问题？

import { useState } from 'react';
import axios from 'axios';  

export default () => {
  const [responce, setResponce] = useState({ status: 'Initiated' });

   

  const setLink = async ({ link, search, config }) => {
    setResponce({ status: 'Laoding' });

try {
  const newConfig = config
    ? {
        headers: {
          'User-Agent': '0.21.1',
          Accept: '*/*',
          'Content-Type': 'application/json;charset=utf-8',
        },
        config,
      }
    : {
        headers: {
          'User-Agent': '0.21.1',
          Accept: '*/*',
          'Content-Type': 'application/json;charset=utf-8',
        },
      };

  const res = await axios.get(link, config);
  // console.log('received response:Offline process ');
  if (res) console.log(res.data);
  else console.log('res null');
  setResponce({ status: 'Laoded' , res});
          
} catch (err) {
  console.log('received error: ', err.toJSON());
  setResponce({ status: 'error Net' });
}


};

  return [responce, setLink];
};

导入作品后使用另一个js文件import useUpdateLookup from "./hooks/useLookup"

const [responce,setLink]  = useLookup()

和returns这个

<View style={styles.container}>  
     <Button onPress={()=> setLink({link:" search:searchOption, config:null})}      
          title="Test URI C" /> 
        <Text style={styles.paragraph}>{JSON.stringify(responce, null, 2)}</Text> 
      </View>

Answer 1

你正在像这样实例化你的状态

const [responce, setResponce] = useState({ status: 'Initiated'})

稍后在 setlink 函数中以这种方式设置状态

setResponce({ 状态: 'Laoded' , res})

如果您想将从请求中获得的响应设置为相同的状态，您也应该将其添加到状态声明中......类似这样

 const [responce, setResponce] = useState({ status: 'Initiated', data:{} });

我不会真的建议为它创建一个单独的状态变量会更好......例如

 const [data, `setData`] = useState({});

另一件需要注意的事情..在 axios 响应中，返回的数据几乎总是存储在 res.data.....'

所以设置请求成功后的状态应该是这样的

setData(res.data)

log axios response.data 导致本机应用程序崩溃

log axios response.data is causing react native app to crash

reactjs

react-native

react-hooks

axios

fetch-api