shershen08 / emoji-vue

Add emoji keyboard to your vuejs project

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

emoji-vue

πŸ˜€ 😁 πŸ˜‚ 🀣 πŸ˜ƒ πŸ˜„ πŸ˜… πŸ˜† πŸ˜‰ 😊 πŸ˜‹

A Vue.js project implementing a input field addon allowing to add emojis via dropdown.

dependencies status

Install βš™οΈ

npm i emoji-vue --save

emoji-vue preview image

Use πŸ˜ŽπŸ‘ŒπŸ»

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" />

Event & properties πŸ“• πŸ“— πŸ“˜ πŸ“™

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

value - property to place 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'.

Build Setup 🧠 ❀️ βœ…

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

Project uses the following setup: guide and docs for vue-loader.

Check the DEMO

About

Based on code from https://github.com/OneSignal/emoji-picker

Create an issue or ping me on twitter @legkoletat

License

MIT

About

Add emoji keyboard to your vuejs project

License:MIT License


Languages

Language:JavaScript 95.1%Language:CSS 2.8%Language:Vue 2.0%Language:HTML 0.2%