在ReactJS中,可以使用类别和子类别来组织列表。以下是一种方法:
const data = [
{
category: 'Category 1',
subcategories: ['Subcategory 1-1', 'Subcategory 1-2', 'Subcategory 1-3']
},
{
category: 'Category 2',
subcategories: ['Subcategory 2-1', 'Subcategory 2-2']
},
{
category: 'Category 3',
subcategories: ['Subcategory 3-1', 'Subcategory 3-2', 'Subcategory 3-3', 'Subcategory 3-4']
}
];
import React from 'react';
const ListComponent = () => {
return (
<div>
{data.map((item, index) => (
<div key={index}>
<h2>{item.category}</h2>
<ul>
{item.subcategories.map((subcategory, subIndex) => (
<li key={subIndex}>{subcategory}</li>
))}
</ul>
</div>
))}
</div>
);
};
export default ListComponent;
这样,根据ReactJS中的类别和子类别,你可以组织一个包含类别和子类别的列表。根据实际需求,你可以进一步扩展和定制列表的样式和功能。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云