ProfileCard 个人名片
EwProfileCard 介绍一个人:头像、姓名、角色、简介,外加可选的数据行与社交链接行。 适用于「关于我们」的团队墙、个人主页的自我介绍位。
基础用法
团队墙三连
无头像时姓名首字自动兜底;stats/social 插槽按需开启。
林一
林一舟
产品设计师
做让人安心的产品,相信留白的力量。
AL
Ada Lovelace
创始工程师
把复杂留给代码,把简单留给用户。
120
提交
32
评审
We
Wen
内容负责人
写字的人,也是删字最多的人。
vue
<EwProfileCard name="林一舟" role="产品设计师" bio="…">
<template #social>
<EwIconButton icon="github" size="small" />
</template>
</EwProfileCard>plain 形态
plain 去掉卡面边框与底色,适合放进 EwCard 的粉彩底或深色卡内做团队介绍。
API
Props
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| name | 姓名(无头像时回退首字) | string | — |
| role | 角色/职位 | string | — |
| bio | 简介文案 | string | — |
| avatar | 头像图片地址 | string | — |
| avatar-size | 头像尺寸(px 或 EwAvatar 预设) | number / string | 72 |
| plain | 朴素形态(无卡面) | boolean | false |
插槽
| 插槽 | 说明 |
|---|---|
| name / role / bio | 姓名/角色/简介覆写 |
| stats | 数据行(常放 EwStatistic) |
| social | 社交链接行(常放 EwIconButton) |