Question

我正在编写一个React Native应用程序。我能够理解如何使用axios或fetch从api数据中检索数据。但我有麻烦。我正在尝试使用从上一类传递的令牌，并使用该令牌来获取新的api和数据。我能够连接到服务器，并且在POSTMAN中连接正常。但是，当我从Visual Studio的终端查看日志时。我得到一个空数组。我得到数组= []。但是我知道应该显示数据。

async componentDidMount(){
try {
  const savedProfile = await AsyncStorage.getItem('userData');
  const profile = JSON.parse(savedProfile);
  const token = profile.token;
  console.log(token);
  const email = profile.user_email;
  const name = profile.user_nicename;
  fetch(url, {
    method: 'GET',
    headers:{
      Accept: 'application/json',
               'Content-Type': 'application/json',
       },
           Authorization: "Bearer " + token,
  })
  .then(response => response.json())
  .then(response => console.log(response));
} catch (err) {
  console.warn(err);
}
};

我认为问题可能与我阅读的本网站上的其他帖子一样在渲染中出现。我也查看了react网站上的文档，但可能需要更多帮助。我首先要做的只是在控制台中打印数据。我在页面上填充了伪数据。但是，如果可能的话，我希望用json数据的特定部分填充我的表。基本上是获取地址，这是一个示例。

"address": "4060 18th Ave NE, Naples, Florida, USA",

其余的渲染看起来像这样。但我希望至少在控制台中显示数据，以便可以从那里进行操作。

render() {
return (
  <View>
    <Header
      centerComponent={{ text: 'Schedule', style: { color: '#fff' } }}
      containerStyle={{
        backgroundColor: '#000000',
        justifyContent: 'space-around',
      }}
    />
    <FlatList
      data={[
        {key: 'Devin'},
        {key: 'Dan'},
        {key: 'Dominic'},
        {key: 'Jackson'},
        {key: 'James'},
        {key: 'Joel'},
        {key: 'John'},
        {key: 'Jillian'},
        {key: 'Jimmy'},
        {key: 'Julie'},
      ]}
      renderItem={({item}) => <Text style={styles.item}>{item.key}</Text>}
    />
  </View>
);
}

Answer 1

以如下所示的正确格式传递标头参数：

headers: { 
   'Accept': 'application/json', 
   'Content-Type': 'application/json', 
   'Authorization': 'Bearer ' + token, 
 }

空数组试图在React Native中渲染数据

1 个答案: