mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-11 23:00:20 +08:00
Code Issues Actions 30 Packages Projects Releases Wiki Activity
5b85d7019c
ant-design/components/list/demo/basic.md
niko 12bbe3776c Feature list component (#7150) 
* add list component

* fixed the demo syntax

* update list snapshots
2017-08-09 15:45:08 +08:00

2.2 KiB
Raw Blame History

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

zh-CN

基础列表。

en-US

Basic List.

import { List, Avatar } from 'antd';

ReactDOM.render(
  <List
    itemLayout="horizontal"
    showLoadMore
    onLoadMore={() => {}}
  >
    <List.Item>
      <List.Item.Meta
        avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />}
        title={<a href="https://ant.design">Ant design</a>}
        description="Ant Design, a design language for background applications, is refined by Ant UED Team"
      />
      <List.Item.Content>
        Content
      </List.Item.Content>
      <List.Item.Action>
        <a>edit</a> | <a>more</a>
      </List.Item.Action>
    </List.Item>
    <List.Item>
      <List.Item.Meta
        avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />}
        title={<a href="https://ant.design">Ant design</a>}
        description="Ant Design, a design language for background applications, is refined by Ant UED Team"
      />
      <List.Item.Content>
        Content
      </List.Item.Content>
      <List.Item.Action>
        <a>edit</a> | <a>more</a>
      </List.Item.Action>
    </List.Item>
    <List.Item>
      <List.Item.Meta
        avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />}
        title={<a href="https://ant.design">Ant design</a>}
        description="Ant Design, a design language for background applications, is refined by Ant UED Team"
      />
      <List.Item.Content>
        Content
      </List.Item.Content>
      <List.Item.Action>
        <a>edit</a> | <a>more</a>
      </List.Item.Action>
    </List.Item>
    <List.Item>
      <List.Item.Meta
        avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />}
        title={<a href="https://ant.design">Ant design</a>}
        description="Ant Design, a design language for background applications, is refined by Ant UED Team"
      />
      <List.Item.Content>
        Content
      </List.Item.Content>
      <List.Item.Action>
        <a>edit</a> | <a>more</a>
      </List.Item.Action>
    </List.Item>
  </List>
, mountNode);