Press "Enter" to skip to content

A Modern GIF | Emoji Picker Vue3 Components For Your App

vue3 discord picker is a new emoji/gif picker for your app! based on disagreement. This component is only available in vue3. Reworking the Print and Configuration API soon.

emoji picker flutter, emoji picker download, vue react emoji picker, js emoji picker demo, javascript trigger emoji picker, emoji picker github

How to make use of it:

Install and download:

# NPM
$ npm i vue3-discordpicker

1. Import and registration.

import DiscordPicker from 'vue3-discordpicker'
Vue.use(DiscordPicker)
// or
export default {
  components: { DiscordPicker }
}

2. Add the component to the template.

<discord-picker
  input
  :value="value"
  gif-format="md"
  @update:value="value = $event"
  @emoji="setEmoji"
  @gif="setGif"
/>
xport default {
  components: { DiscordPicker },
  data () {
    return {
      value: ''
    }
  },
  methods: {
    setEmoji (emoji) {
      console.log(emoji)
    },
    setGif (gif) {
      console.log(gif)
    }
  }
}

3. Props are available.

// custom categories
categories: {
  type: Array,
  default () {
    return ['people','animals','foods','travel','activities','objects','symbols','flags']
  }
},
// placeholder text
placeholder: {
  type: String,
  default: 'Type your message'
},
// load input with autocomplete
input: {
  type: Boolean,
  default: false
},
// input value
value: {
  type: [String, Number],
  default: null,
},
// return gif link with markdown format or html format
gifFormat: {
  type: String
},
// tenor.com API KEY 
key: {
  type: String
}

Modern Emoji & GIF Picker For Vue 3, vue3 discord picker Plugin/Github


See Demo And Download

Official Website(enzostvs): Click Here

This superior jQuery/javascript plugin is developed by enzostvs. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published.