Mention

Matches Arco Mention with the filled input and Select-style suggestions. See the Element Plus docs for props.

Mention Suggestions

Type @ to open suggestions, then select with the keyboard or mouse.

<script setup lang="ts">
import { ref } from 'vue'
const value = ref('')
const options = [
  { value: 'alex', label: 'Alex' },
  { value: 'sam', label: 'Sam' },
  { value: 'taylor', label: 'Taylor', disabled: true },
]
</script>

<template>
  <el-mention v-model="value" :options="options" placeholder="Type @ to mention someone" style="width: 320px" />
</template>

Differences from Arco

• The panel follows the caret and sizes to its content; Arco places a full-width panel below the input.