在React中显示3行数据可以通过以下步骤实现:
以下是一个示例代码:
import React, { useState } from 'react';
const DataDisplay = () => {
const [data, setData] = useState(['Data 1', 'Data 2', 'Data 3']);
return (
<div>
{data.map((item, index) => (
<div key={index}>{item}</div>
))}
</div>
);
};
export default DataDisplay;
在上述代码中,我们使用useState钩子来定义一个名为data的状态变量,初始值为包含3个数据的数组。然后在render方法中,使用map函数遍历data数组,生成包含每个数据的div元素,并设置key属性以提高渲染性能。
你可以将上述代码保存为一个名为DataDisplay.js的文件,并在其他组件中引入和使用该组件来显示3行数据。
领取专属 10元无门槛券
手把手带您无忧上云