联系人列表 Svelte 组件
联系人列表不是一个单独的组件,而只是使用 <List> 和 <ListItem> 组件的特定情况。
联系人列表属性
属性 | 类型 | 默认值 | 描述 |
---|---|---|---|
<List> 属性 | |||
contactsList | 布尔值 | false | 添加联系人列表所需的额外样式 |
示例
contacts-list.svelte
<script>
import { Navbar, Page, List, ListGroup, ListItem } from 'framework7-svelte';
</script>
<Page>
<Navbar title="Contacts List" />
<List contactsList ul={false} strongIos>
<ListGroup>
<ListItem title="A" groupTitle />
<ListItem title="Aaron " />
<ListItem title="Abbie" />
<ListItem title="Adam" />
<ListItem title="Adele" />
<ListItem title="Agatha" />
<ListItem title="Agnes" />
<ListItem title="Albert" />
<ListItem title="Alexander" />
</ListGroup>
<ListGroup>
<ListItem title="B" groupTitle />
<ListItem title="Bailey" />
<ListItem title="Barclay" />
<ListItem title="Bartolo" />
<ListItem title="Bellamy" />
<ListItem title="Belle" />
<ListItem title="Benjamin" />
</ListGroup>
<ListGroup>
<ListItem title="C" groupTitle />
<ListItem title="Caiden" />
<ListItem title="Calvin" />
<ListItem title="Candy" />
<ListItem title="Carl" />
<ListItem title="Cherilyn" />
<ListItem title="Chester" />
<ListItem title="Chloe" />
</ListGroup>
<ListGroup>
<ListItem title="V" groupTitle />
<ListItem title="Vladimir" />
</ListGroup>
</List>
</Page>