Installation

npm i iconpicker-fontawesome-vue3

or

yarn add iconpicker-fontawesome-vue3

Get Start

Import iconpicker-fontawesome-vue3 into your component

import IconpickerFontawesome from "iconpicker-fontawesome-vue3";

export default {
  name: "App",
  components: {
    IconpickerFontawesome,
  },
  data() {
    return {
      icon: null,
    };
  },
};

Use the component

<div class="w-screen h-screen flex justify-center items-center flex-col">
  <IconpickerFontawesome v-model:icon="icon" />
</div>

Options

Properties accepted by ccomponent

Pro version icons

Options Api

import icons from "./fontawesome-pro-6.4.2/metadata/icons.json";

export default {
  data() {
    return {
      icons,
    };
  },
};

Componsitions Api

import icons from "./fontawesome-pro-6.4.2/metadata/icons.json";
import { ref } from "vue";

export default {
  setup() {
    const iconsPro = ref(icons);
    return {
      iconsPro,
    };
  },
};

Componsitions Api setup

import icons from "./fontawesome-pro-6.4.2/metadata/icons.json";
import { ref } from "vue";

const iconsPro = ref(icons);

<IconpickerFontawesome v-model:icon="icon" :icons="iconsPro" />