<template>
<div>
  <div class='iconList'>
    <span v-for='(item,index) in emojiList' :key='index'  @click='addIcon(item)' class='smile'>{{item}}</span>
  </div>
  <textarea v-model="content"></textarea>
</div>
</template>

<script>
// npm install emoji
// "emoji": "^0.3.2",
import emoji from 'emoji'
export default {
  data() {
    return {
      emojiListAll:Object.keys(emoji.EMOJI_MAP),
      emojiList:Object.keys(emoji.EMOJI_MAP).slice(191,213).concat(Object.keys(emoji.EMOJI_MAP).slice(215,239)),
      content: "",
    }
  },
  methods: {
    addIcon(icon){
      this.content += icon;
    },
  }
}
</script>