mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-12 12:25:22 +08:00
0456c790db
* feat: add mention component * fix: build error * fix: build error * feat: delete as a whole * fix: update docs * fix: update global.d.ts * fix: update * fix: update code * fix: update code * fix: update code * fix: rename * fix: update code * fix: upload code * fix: update code * fix: fixed cursor position abnormality * fix: update code * fix: docs add avatar * fix: tooltip position is wrong when placing on top * feat: add overview icon * fix: overview icon color
40 lines
882 B
Vue
40 lines
882 B
Vue
<template>
|
|
<el-mention
|
|
v-model="value"
|
|
:options="options"
|
|
style="width: 320px"
|
|
placeholder="Please input"
|
|
>
|
|
<template #label="{ item }">
|
|
<div style="display: flex; align-items: center">
|
|
<el-avatar :size="24" :src="item.avatar" />
|
|
<span style="margin-left: 6px">{{ item.value }}</span>
|
|
</div>
|
|
</template>
|
|
</el-mention>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
const value = ref('')
|
|
|
|
const options = ref([
|
|
{
|
|
value: 'Fuphoenixes',
|
|
avatar: 'https://avatars.githubusercontent.com/u/27912232',
|
|
},
|
|
{
|
|
value: 'kooriookami',
|
|
avatar: 'https://avatars.githubusercontent.com/u/38392315',
|
|
},
|
|
{
|
|
value: 'Jeremy',
|
|
avatar: 'https://avatars.githubusercontent.com/u/15975785',
|
|
},
|
|
{
|
|
value: 'btea',
|
|
avatar: 'https://avatars.githubusercontent.com/u/24516654',
|
|
},
|
|
])
|
|
</script>
|