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

update the master branch to the latest

Browse source
This commit is contained in:
梁灏 2019-08-27 09:42:40 +08:00
parent 67d534df27
commit 23a0ba9831
611 changed files with 122648 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

120
examples/routers/list.vue Normal file
View file

@ -0,0 +1,120 @@
<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 }}
</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>
<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.
<template slot="action">
<li>
<Icon type="ios-star-outline" /> 156
</li>
<li>
<Icon type="ios-thumbs-up-outline" /> 156
</li>
<li>
<Icon type="ios-chatbubbles-outline" /> 10
</li>
</template>
<template slot="extra">
<img src="https://dev-file.iviewui.com/5wxHCQMUyrauMCGSVEYVxHR5JmvS7DpH/large" style="width: 280px">
</template>
</ListItem>
</List>
</div>
</template>
<script>
export default {
data () {
return {
data1: [
'Racing car sprays burning fuel into crowd.',
'Japanese princess to wed commoner.',
'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'
}
]
};
}
};
</script>