コンタクトリスト Svelte コンポーネント

コンタクトリストは別のコンポーネントではなく、<List> と <ListItem> コンポーネントを使用する際の特定のケースです。

コンタクトリストのプロパティ

プロパティ	型	デフォルト	説明
<List> プロパティ
contactsList	boolean	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>

このドキュメントを改善

このページで

コンタクトリストのプロパティ
例