android - 通过 fetchAPI 获取数据后,FlatList 在 ios 上呈现,但不在 android 上呈现
问题描述
我正在使用本机反应并尝试根据我使用 fetch API 获取的数据呈现一个简单的平面列表。
下面是代码 -
class CategoryList extends React.Component
{
constructor(props)
{
super(props);
var context = this;
this.state = {
categories: []
}
}
componentDidMount()
{
fetch(api_config.url + api_config.routes.all_top_level_categories)
.then(response => response.json())
.then(data => this.setState({ categories: data}))
.catch(e => console.log(e));
}
renderFlatListItem(data)
{
return(<View style={styles.item}>
<Text>{data.item.name}</Text>
</View>);
}
renderItemSeparator()
{
return(
<View
contentContainerStyle={styles.itemSeparator} />
);
}
render() {
return (
<FlatList contentContainerStyle={styles.list}
data={this.state.categories}
renderItem={(data) => this.renderFlatListItem(data)}
ItemSeparatorComponent={this.renderItemSeparator}
keyExtractor={data => data.name}
/>
);
}
}
export default class HomeScreen extends React.Component
{
static navigationOptions = ({ navigation }) => {
return {
title: 'Home',
}
};
render() {
return (
<CategoryList />
);
}
}
下面是 Android 的图像 -
下面是 iOS 的图像 -
任何有关该主题的帮助将不胜感激。谢谢你。
解决方案
推荐阅读
- reactjs - 如何基于现有的 React 组件创建 jupyter 扩展
- linux - 如何制作类似 /proc 的文件
- angular - 订阅主题连续接收多次
- opengl - 计算着色器图像和原子一致性
- ios - 过渡动画不工作 Swift 5
- excel - 为什么 Replace(x,Chr(160)) 替换 Empty Space AND comma 而不是 Empty Space
- node.js - 如何在 Elastic Beanstalk 上启用安全 Web 套接字
- html - IE11 在网格中居中时忽略绝对项目内容宽度
- php - 如何从数据库中检索和显示图像?
- c++ - 进程中线程的最高优先级是什么?