Uncaught TypeError: Cannot read properties of undefined (reading 'allCategories')

[leonwisdom]

I am using Vue 3 with the Composition API and following the documentation but i am running into an error. Any help would be greatly appreciated, thank you

[serebrov]

@leonwisdom Could you provide an example of the code that reproduces the error?

[leonwisdom]

@serebrov My apologies for the late reply, i have recently got back from holiday.

Here is the code, the css file is imported globally:

<template>
  <Picker v-if="emojiPickerSelected" :data="emojiIndex"
      title="Pick your emoji…" emoji="point_up" @select="convertEmoji"
  />
</template>
  
<script>
import { ref } from "vue";
import { Picker, EmojiIndex } from "emoji-mart-vue-fast/src";
import data from "emoji-mart-vue-fast/data/all.json";

export default {
  name: "EmojiPicker",
  components: {
    Picker
  },
  emits: ["updateEmoji"],
  setup(props, context) {
    const emojiPickerSelected = ref(false);
    let emojiIndex = new EmojiIndex(data);

    const toggle = () => {
      emojiPickerSelected.value = !emojiPickerSelected.value;
    }

    const convertEmoji = (emoji) => {
      context.emit("updateEmoji", emoji.native);
    }

    return {
      emojiPickerSelected,
      emojiIndex,
      toggle,
      convertEmoji,
    };
  }
};
</script>

Thank you for looking into this, i have followed the instructions on how to use and setup. here are the versions i am using: Vue - 3.2.45 emoji-mart-vue-fast - 12.0.1

[serebrov]

@leonwisdom I am still not able to reproduce the error. I added your example into the Vue 3 demo project, but it works fine - no error:

Live demo is here: https://serebrov.github.io/emoji-mart-vue3-demo/