mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-07-30 03:16:31 +08:00
Code Issues Actions 39 Packages Projects Releases Wiki Activity
b10f7726c3
ant-design/components/list/demo/basic.md
niko 56f0716b03 List: support responsive (#7272) 
* List: support responsive

* change grid api for responsive & use card responsive function

* abstract getGrid

* update snapshots

* defind grid columns number

* defind grid columns number

* add ListGridType
2017-08-21 21:14:20 +08:00

1.9 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 actions={[<a>编辑</a>, <a>更多</a>]}>
      <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"
      />
      <div style={{ padding: 24 }}>Content</div>
    </List.Item>
    <List.Item actions={[<a>编辑</a>, <a>更多</a>]}>
      <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"
      />
      <div style={{ padding: 24 }}>Content</div>
    </List.Item>
    <List.Item actions={[<a>编辑</a>, <a>更多</a>]}>
      <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"
      />
      <div style={{ padding: 24 }}>Content</div>
    </List.Item>
    <List.Item actions={[<a>编辑</a>, <a>更多</a>]}>
      <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"
      />
      <div style={{ padding: 24 }}>Content</div>
    </List.Item>
  </List>
, mountNode);