ant-design/components/list/demo/basic.md
afc163 827225b895
chore: replace demo image to public avatar resources (#32479)
* docs: replace avatar image to joeschmoe placeholder

* docs: usage randomme avatar url
2021-10-14 12:09:07 +08:00

800 B

order title
1
zh-CN en-US
基础列表 Basic list

zh-CN

基础列表。

en-US

Basic list.

import { List, Avatar } from 'antd';

const data = [
  {
    title: 'Ant Design Title 1',
  },
  {
    title: 'Ant Design Title 2',
  },
  {
    title: 'Ant Design Title 3',
  },
  {
    title: 'Ant Design Title 4',
  },
];

ReactDOM.render(
  <List
    itemLayout="horizontal"
    dataSource={data}
    renderItem={item => (
      <List.Item>
        <List.Item.Meta
          avatar={<Avatar src="https://joeschmoe.io/api/v1/random" />}
          title={<a href="https://ant.design">{item.title}</a>}
          description="Ant Design, a design language for background applications, is refined by Ant UED Team"
        />
      </List.Item>
    )}
  />,
  mountNode,
);