drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update List

Browse source
This commit is contained in:
梁灏 2019-06-08 15:53:25 +08:00
parent fb7f36f91b
commit c501f03c9d
4 changed files with 155 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

110
examples/routers/list.vue
View file

@ -1,26 +1,75 @@
<template>
<div>
<h2>small size</h2>
<List header="Header" footer="Footer" size="small" :split="false">
<ListItem v-for="item in data1" :key="item">
{{ item }}
</ListItem>
</List>
<h2>default size</h2>
<List header="Header" footer="Footer">
<ListItem v-for="item in data1" :key="item">
{{ item }}
</ListItem>
</List>
<h2>large size</h2>
<List header="Header" footer="Footer" border size="large">
<ListItem v-for="item in data1" :key="item">
{{ item }}
<!-- <h2>small size</h2>-->
<!-- <List header="Header" footer="Footer" size="small" :split="false">-->
<!-- <ListItem v-for="item in data1" :key="item">-->
<!-- {{ item }}-->
<!-- </ListItem>-->
<!-- </List>-->
<!-- <h2>default size</h2>-->
<!-- <List header="Header" footer="Footer">-->
<!-- <ListItem v-for="item in data1" :key="item">-->
<!-- {{ item }}-->
<!-- </ListItem>-->
<!-- </List>-->
<!-- <h2>large size</h2>-->
<!-- <List header="Header" footer="Footer" border size="large">-->
<!-- <ListItem v-for="item in data1" :key="item">-->
<!-- {{ item }}-->
<!-- </ListItem>-->
<!-- </List>-->
<!-- <Divider>没有 </Divider>-->
<!-- <List>-->
<!-- <ListItem v-for="item in data2" :key="item.title">-->
<!-- <ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">-->
<!-- </ListItemMeta>-->
<!-- 一段内容-->
<!-- </ListItem>-->
<!-- </List>-->
<Divider>带有 Action</Divider>
<List>
<ListItem v-for="item in data2" :key="item.title">
<ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">
</ListItemMeta>
一段内容
<template slot="action">
<li>
<a href="">edit</a>
<!-- <Button typr="primary">编辑</Button>-->
</li>
<li>
<a href="">more</a>
<!-- <Button>删除</Button>-->
</li>
</template>
</ListItem>
</List>
<Divider></Divider>
<!-- <Divider>带图片</Divider>-->
<!-- <List item-layout="vertical">-->
<!-- <ListItem v-for="item in data2" :key="item.title">-->
<!-- <ListItemMeta :avatar="item.avatar" :title="item.title" :description="item.description">-->
<!-- </ListItemMeta>-->
<!-- We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.-->
<!--&lt;!&ndash; <template slot="action">&ndash;&gt;-->
<!--&lt;!&ndash; <li>&ndash;&gt;-->
<!--&lt;!&ndash; <Icon type="ios-star-outline" /> 156&ndash;&gt;-->
<!--&lt;!&ndash; </li>&ndash;&gt;-->
<!--&lt;!&ndash; <li>&ndash;&gt;-->
<!--&lt;!&ndash; <Icon type="ios-thumbs-up-outline" /> 156&ndash;&gt;-->
<!--&lt;!&ndash; </li>&ndash;&gt;-->
<!--&lt;!&ndash; <li>&ndash;&gt;-->
<!--&lt;!&ndash; <Icon type="ios-chatbubbles-outline" /> 10&ndash;&gt;-->
<!--&lt;!&ndash; </li>&ndash;&gt;-->
<!--&lt;!&ndash; </template>&ndash;&gt;-->
<!-- </ListItem>-->
<!-- </List>-->
</div>
</template>
@ -34,6 +83,33 @@
'Australian walks 100km after outback crash.',
'Man charged over missing wedding girl.',
'Los Angeles battles huge wildfires.',
],
data2: [
{
title: 'This is a title 1',
description: 'This is the description, This is the description, This is the description.',
avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
},
{
title: 'This is a title 2',
description: 'This is the description, This is the description, This is the description.',
avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
},
{
title: 'This is a title 3',
description: 'This is the description, This is the description, This is the description.',
avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
},
{
title: 'This is a title 4',
description: 'This is the description, This is the description, This is the description.',
avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
},
{
title: 'This is a title 5',
description: 'This is the description, This is the description, This is the description.',
avatar: 'https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar'
}
]
};
}