Basic Example

Class Name

Basic usage that lets you to select the class name of an icon

<template>
  <vfa-picker v-model="v">
    <template v-slot:activator="{ on }">
      <input v-model="v" @click="on" placeholder="Icon Class" type="text" />
    </template>
  </vfa-picker>
</template>

<script>
export default {
    name: "BasicClassExample",
    data() {
      return {
        v: undefined
      }
    }
}
</script>

Unicode

Basic usage that lets you to select the unicode of an icon

<template>
  <vfa-picker v-model="u" is-unicode="true">
    <template v-slot:activator="{ on }">
      <input v-model="u" @click="on" placeholder="Icon Unicode" type="text" />
    </template>
  </vfa-picker>
</template>

<script>
export default {
    name: "BasicUnicodeExample",
    data() {
      return {
        u: undefined
      }
    }
}
</script>

Class & Unicode

Basic usage that lets you to select the unicode of an icon

<template>
  <vfa-picker is-both="true" v-bind.sync="category">
    <template v-slot:activator="{ on }">
      <input v-model="category.class" @click="on" placeholder="Icon Class" type="text" />
      <input v-model="category.unicode" @click="on" placeholder="Icon Unicode" type="text" />
    </template>
  </vfa-picker>
</template>

<script>
export default {
    name: "BasicBothExample",
    data() {
      return {
          category: {
              class: undefined,
              unicode: undefined
          }
      }
    }
}
</script>