时间戳

首页 > 解决方案 > 有人逐步使用 vue-twemoji-picker 吗？

vue.js - 有人逐步使用 vue-twemoji-picker 吗？

问题描述

我是 vue 的初学者，我用 vue 开发了一个简单的聊天应用程序，并且需要表情符号。我找到了https://github.com/kevinfaguiar/vue-twemoji-picker，但没有完整的启动项目文档。我使用 vue-cli，有没有人可以提供几个步骤来使用它..？

谢谢

标签： vue.jsvue-cli

解决方案

刚看到你的问题...我是 vue-twemoji-picker 的作者。v^4.0.0 的文档有点……一团糟哈哈。

最近我已将该组件更新为主要版本 (v^5.0.0)，其中包括一个新的文档网站，比另一个更详细和视觉上令人愉悦，也许它会比以前更好地满足您的需求：https：/ /kevinfaguiar.github.io/vue-twemoji-picker/docs/getting-started/#using-twemojipicker

此外，如果您不想使用文档网站，这个 Vue 片段应该可以按预期工作：

<template>
  <twemoji-textarea 
    :emojiData="emojiDataAll" 
    :emojiGroups="emojiGroups" 
    @enterKey="onEnterKey">
  </twemoji-textarea>
</template>

<script>
  import {
    TwemojiTextarea
  } from '@kevinfaguiar/vue-twemoji-picker';
  import EmojiAllData from '@kevinfaguiar/vue-twemoji-picker/emoji-data/en/emoji-all-groups.json';
  import EmojiGroups from '@kevinfaguiar/vue-twemoji-picker/emoji-data/emoji-groups.json';
  export default {
    name: 'App',
    components: {
      'twemoji-textarea': TwemojiTextarea
    },
    computed: {
      emojiDataAll() {
          return EmojiAllData;
      },
      emojiGroups() {
          return EmojiGroups;
      }
    },
    methods: {
      onEnterKey(e) {
        console.log("ClickedEnter", e);
      }
    }
  }
</script>

如果您觉得文档缺少某些内容，请不要犹豫，在 Github 存储库中打开问题：https ://github.com/kevinfaguiar/vue-twemoji-picker/issues

很高兴知道人们正在使用我的项目并收到来自社区的反馈

推荐阅读