Vue Reactions

Appearance

Return to top
On this page

Reactions

Array of reactions for component to show in dropdown

Prop nameTypeDefault valueRequired
reactionsIReaction[]-Y

Example of prop value

typescript
[
  {
    id: 1,
    label: "Heart",
    emoji: "❤️",
  },
  {
    id: 2,
    label: "Cool",
    emoji: "👍",
  },
  {
    id: 3,
    label: "Bad",
    emoji: "👎",
  },
]

IReaction

typescript
interface IReaction {
  id: string | number;
  label?: string;
  emoji?: string;
}
KeyTypeRequired
idstring or numberY
labelstringN
emojistringY

Code example

vue
<template>
  <vue-reactions :reactions="reactions" />
</template>

<script setup lang="ts">
import { ref } from "vue";

const reactions = ref([
  {
    id: 1,
    label: "Heart",
    emoji: "❤️",
  },
  {
    id: 2,
    label: "Cool",
    emoji: "👍",
  },
  {
    id: 3,
    label: "Bad",
    emoji: "👎",
  },
]);
</script>