在antd中的卡片标题上添加图标和标题

Question

我正试图在antd响应卡中添加标题和图标，但无法添加并找到任何解决方案，任何人都能帮我吗，因为我对此很陌生，我无法理解

const data = [
{
title: 'Title 1',
},
{
title:  <SearchOutlined />'Title 2',
},
];
ReactDOM.render(
<List
grid={{
gutter: 16,
xs: 1,
sm: 2,
md: 4,
lg: 4,
xl: 6,
xxl: 3,
}}
dataSource={data}
renderItem={item => (
<List.Item>
<Card title={item.title}>Card content</Card>
</List.Item>
)}
/>,
document.getElementById('container'),
);

Answer 1

你很接近。只需将标题内容与反应片段一起附上即可

const data = [
{
title: "Title 1",
content: (
<div>Content 1</div>
)
},
{
title: (
<>
<SearchOutlined /> Title 2
</>
),
content: (
<div>Content 2</div>
)
}
];
<List
dataSource={data}
renderItem={item => (
<List.Item>
<Card title={item.title}>{item.content}</Card>
</List.Item>
)}
/>