Skip to content

OcEmojiPicker component

Description

The OcEmojiPicker component lets the user select an emoji from a list of commonly used emojis.

Examples

Default

The most basic use case of the component listens to the emoji-select event to get the selected emoji.

vue
<template>
  <oc-emoji-picker @emoji-select="updateSelectedEmoji" />
  <p>Selected emoji: {{ selectedEmoji }}</p>
</template>

<script setup lang="ts">
import { Emoji } from 'emoji-mart'
import { ref } from 'vue'

const selectedEmoji = ref<Emoji>()

const updateSelectedEmoji = (emoji: Emoji) => {
  selectedEmoji.value = emoji
}
</script>

Properties

Emits

Slots