介绍

在 React Native 里遍历渲染数据？这节课就告诉你。

大家好，这里是东哥。您现在收看的是「长乐未央全栈系列：React Native 项目实战」课程的第 8 回：使用 map 遍历并渲染数据，在这节课里，我们将探讨：

• 如何将状态里数组中的多个数据，遍历渲染出来？
• React 里 key 的作用

遍历数据

在useState里定义的数据，在很多时候，都是读取的接口数据，然后遍历出来，显示到页面上。

咱们现在还没有学如何读取接口，可以先定义一点假数据，然后遍历一下试试。

使用数组定义状态

上节课咱们定义的count不要了，这次改为定义个课程数组：

const [courses, setCourses] = useState([
  { id: 1, name: 'HTML' },
  { id: 2, name: 'CSS' },
  { id: 3, name: 'JavaScript' },
  { id: 4, name: 'React' },
  { i...