Press "Enter" to skip to content

Add Emoji Keyboard To Your Vuejs Component

Emoji is a Vue.js project that implements the input field supplement that allows the addition of emojis via the dropdown menu.

v emoji picker, emoji picker element, vue3 emoji picker, emoji picker js, emoji mart, vue emoji icon

Event & properties 📕 📗 📘 📙

@input – event generated when the content of textarea with emoji selector is changed.

value – property to place the initial content of the textarea.

width – sets width of visible textarea in px; defaults to ‘200px’.

height – sets height of visible textarea in px; defaults to ’50px’.

How to make use of it:

Install

npm i emoji-vue --save

Usage

import VueEmoji from 'emoji-vue'


//in component def
  methods: {
      onInput(event) {
          //event.data contains the value of the textarea
      },
      clearTextarea(){
        this.$refs.emoji.clear()
      },  
  },
  components: {
    VueEmoji
  }

//in template section
<VueEmoji ref="emoji" @input="onInput" :value="myText" />

emoji picker component for vue js, emoji-vue Plugin/Github


See Demo And Download

Official Website(shershen08): Click Here

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

Be First to Comment

    Leave a Reply

    Your email address will not be published.