react遍历生成5个不同颜色的div块且在每个div块遍历渲染不同的数据

可以使用React的map方法来遍历一个数据数组，并在每个循环中生成一个不同颜色的div块，并渲染不同的数据。以下是一个示例代码：

import React from 'react';

const data = ['Data 1', 'Data 2', 'Data 3', 'Data 4', 'Data 5'];
const colors = ['red', 'blue', 'green', 'yellow', 'orange'];

const App = () => {
  return (
    <div>
      {data.map((item, index) => (
        <div key={index} style={{ backgroundColor: colors[index], padding: '10px', margin: '10px' }}>
          {item}
        </div>
      ))}
    </div>
  );
};

export default App;

在上面的代码中，我们定义了一个data数组来存储要遍历渲染的数据，同时定义了一个colors数组来存储不同颜色的值。然后，我们使用map方法遍历data数组，并在每个循环中生成一个带有不同背景颜色和数据的div块。

请注意，我们在每个生成的div块上使用了key属性来提供唯一的标识符，这是React中列表渲染的要求