Files
layui/example/docs/zh-CN/components/avatar.md
2022-02-06 05:20:07 +08:00

2.2 KiB

::: anchor :::

::: title 基本介绍 :::

::: describe 用来代表用户或事物,支持图片、图标或字符展示。 :::

::: title 基础使用 :::

::: demo 使用 lay-avatar 标签, 创建头像

<script> import { ref } from 'vue' export default { setup() { const src = ref("https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png") return { src } } } </script>

:::

::: title 圆角头像 :::

::: demo

<script> import { ref } from 'vue' export default { setup() { const src = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png" return { src } } } </script>

:::

::: title 尺寸大小 :::

::: demo

         <script> import { ref } from 'vue' export default { setup() { const src = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png" return { src } } } </script>

:::

::: title 头像列表 :::

::: demo

<script> import { ref } from 'vue' export default { setup() { const src = "https://portrait.gitee.com/uploads/avatars/user/2813/8441097_shaynas_1610801433.png" return { src } } } </script>

:::

::: title Avatar 属性 :::

::: table

属性 描述 可选值
src 图源 --
size 尺寸 xs sm lg
radius 圆形 true false

:::

::: comment :::

::: previousNext avatar :::