mirror of
https://github.com/element-plus/element-plus.git
synced 2024-12-15 02:40:46 +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
29 lines
671 B
Vue
29 lines
671 B
Vue
<template>
|
|
<el-mention
|
|
v-model="value"
|
|
:options="options"
|
|
:prefix="['@', '#']"
|
|
style="width: 320px"
|
|
placeholder="input @ to mention people, # to mention tag"
|
|
@search="handleSearch"
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import type { MentionOption } from 'element-plus'
|
|
|
|
const MOCK_DATA: Record<string, string[]> = {
|
|
'@': ['Fuphoenixes', 'kooriookami', 'Jeremy', 'btea'],
|
|
'#': ['1.0', '2.0', '3.0'],
|
|
}
|
|
const value = ref('')
|
|
const options = ref<MentionOption[]>([])
|
|
|
|
const handleSearch = (_: string, prefix: string) => {
|
|
options.value = (MOCK_DATA[prefix] || []).map((value) => ({
|
|
value,
|
|
}))
|
|
}
|
|
</script>
|