React Native axios请求API后map遍历数据无法渲染问题

代码无法正常渲染州名称是两处写法错误导致的：

• map遍历的回调函数用大括号包裹时，没有显式return要渲染的JSX元素，遍历完成后没有返回任何可渲染内容
• 遍历取值错误：单条遍历项是回调参数item，代码错误读取了整个状态数组data的nome属性，数组本身不存在该属性，拿不到正确的州名
• 遍历渲染列表时未给列表项设置唯一key属性，会触发React渲染警告，极端场景下会出现渲染错乱

将原代码中map遍历的部分替换为以下内容即可：

{data.map((item) => {
  return <Text key={item.id}>{item.nome}</Text>
})}

也可以用箭头函数隐式返回的写法更精简（大括号替换为小括号，省略return关键字）：

{data.map(item => (
  <Text key={item.id}>{item.nome}</Text>
))}

优化提示：该接口返回的每个州数据自带唯一id字段，用它作为key比数组索引更符合React性能优化要求。如果后续需要渲染百条以上的长列表，推荐使用React Native内置的FlatList组件替代map直接渲染，滚动流畅度会更好。

内容的提问来源于stack exchange，提问作者R1pley