使用v-emoji-picker插件表情不显示报错解决

最新推荐文章于 2024-05-30 09:30:26 发布
最新推荐文章于 2024-05-30 09:30:26 发布
阅读量2.8k 收藏
点赞数
分类专栏： 踩过的坑 vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011364720/article/details/102765700
版权
使用v-emoji-picker插件，报错如下：

在这里插入图片描述

TypeError: dataEmojis.forEach is not a function
解决：

找到插件的dist目录，进入v-emoji-picker.umd.js，ctrl+f查找‘dataEmojis.forEach’（第2156行左右）修改为dataEmojis.data.forEach（也就是遍历层级错了，加上data）

v-emoji-picker是个emoji输入的轮子，v-emoji-picker安装方式

npm install v-emoji-picker

用法：Lightweight Package of Emoji Picker in Vue

酒后不debug
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
Vue - 超详细实现 emoji 表情，安装并使用 v-emoji-picker 表情插件及各种功能，可在光标处插入表情和文字混排（提供了存入后端数据库的转码和解码方案，轻松将文字和表情发送给接口）
王佳斌
07-23 6903
vue emoji，vue通用emoji表情库，vue网页怎么在输入框中选表情，vue项目实现表情包，vue如何实现input框输入emoji表情，vue好用的表情插件库，vue聊天框输入emoji表情，vue显示emoji表情emoji微信表情，vue仿微信emoji表情包，vue表情符插件emoji表情符 表情输入框 类似微信qq的表情，vue使用v-emoji-picker，在vue中使用v-emoji-picker详细使用教程，v-emoji-picker插件怎么将修改search提示变成中文，v-
discord-emoji-picker：不和谐表情符号选择器
02-05
不和谐表情符号选择器 不和谐表情符号选择器
v-emoji-picker-V使用emojis原生语言（unicode）在Vue中的一个轻量级和可自定义的Emoji Picker程序包。-Vue.js开发
05-27
V-Emoji-Picker这个使用Emojis Natives内容的简单软件包V-Emoji-Picker内容安装用法道具使用自定义Emojis事件使用cus V-Emoji-Picker这个简单的软件包使用Emojis Natives目录V-Emoji-Picker内容安装用法Props事件使用自定义表情符号使用自定义类别使用SVG更新版本2迁移到版本2结构表情符号大小许可证安装yarn add v-emoji-picker用法
推荐开源项目：Vue Twemoji Picker - 轻松构建高效且美观的Emoji选择器
最新发布
gitblog_00029的博客
05-30 325
推荐开源项目：Vue Twemoji Picker - 轻松构建高效且美观的Emoji选择器 项目地址:https://gitcode.com/kevinfaguiar/vue-twemoji-picker 1、项目介绍 Vue Twemoji Picker 是一个专为开发者设计的轻量级、易于集成且高性能的Emoji选择器组件。它基于Twitter的开源表情艺术（Twemojis），并充分利用了最...
移动端开发评论模块的时候添加一些emoji表情
qian_li_hui的博客
04-24 482
在做一个评论模块的时候，首先做一个遮罩层，在点击评论是显示，想在评论的内容添加一些emoji表情，在网上搜了一堆之后，发现最适合的还是v-emoji-picker组件库。 首先是下载该库npm install v-emoji-picker(我这边前端的依赖管理用的是npm)下载完成后，你可以选择在全局使用该组件，也可以在某个页面使用。 因为这个组件没有设置是否显示和隐藏的属性，所以我们可以使用vue的指令v-show 来使这个组件是否显示出来 <div class="overlay-input
vue v-emoji-picker的使用
six_teen的博客
12-05 6107
在做一个评论模块的时候，想在评论的内容添加一些emoji表情，在网上搜了一堆之后，发现最适合的还是v-emoji-picker组件库。 首先是下载该库npm install v-emoji-picker(我这边前端的依赖管理用的是npm)下载完成后，你可以选择在全局使用该组件，也可以在某个页面使用。 因为这个组件没有设置是否显示和隐藏的属性，所以我们可以使用vue的指令v-show 来使这个组件是否显示出来 <template> <div class="app-container"&g
javaweb 处理 emoji表情
qq_39205291的博客
02-11 524
原文参考http://dditblog.com/itshare_444.html利用Emoji Picker插件直接在input 或者textarea生成表情插件核心代码&lt;div class="inner cover"&gt; &lt;p class="lead emoji-picker-container"&gt; &lt;input type="email" c...
一个值得收藏的Vue表情包组件
weixin_34319111的博客
04-03 5235
V-Emoji-Picker 一个小清新组件 话不多说，先来看看效果图 安装 yarn add v-emoji-picker 复制代码用法 <template> <div id="app"> <VEmojiPicker :pack="pack" @select="selectEmoji" /> </div> </templat...
简洁好使用的emoji表情组件在vue2中的使用
weixin_54203047的博客
10-26 1828
第三步，在模板内使用，可以通过:style设置一些属性，通过@select调用emoji组件方法传递表情数据，在我们这个父组件中可以把他添加到评论内容里去。为什么我会找到这么一个表情选择器呢，因为我个人最近在开发一个个人博客，里面有个评论功能需要使用的emoji表情来丰富评论内容，营造更好的良性互动。第二步，在你封装的组件内导入,这三个必不可少，还要记得他也是一个封装好的组件，要声明一下。这里是官方提供的一个vue使用模板的网址。话不多说，接下来看怎么使用。首先呢，要先导入对应的依赖。
vue-emoji-picker-高度可定制的unicode表情符号选择器:fire::rocket:-Vue.js开发
05-27
用于Vue 2的高度可定制的表情符号选择器目录通过npm进行的演示安装，带有CDN导入通过ES6捆绑器（通过npm）使用每个compon用于Vue 2的高度可定制的表情符号选择器，...使用npm安装npm i vue-emoji-picker-使用CDN保存
V-Emoji-Picker：：star2：使用emojis原生语言（unicode）在Vue中的一个轻量级和可自定义的Emoji Picker程序包
02-04
V表情符号选择器 这个使用Emojis Natives的简单软件包 内容 安装 yarn add v-emoji-picker 用法 < template> < div xss=removed> < VEmojiPicker xss=removed> </ div> </ template> < script > import { VEmojiPicker } from ' v-emoji-picker ' ; export default { name : ' Demo ' , components : { VEmo
emoji-picker-react:React表情符号选择器
04-28
表情符号选择器React V3 ...Emoji-picker-react可以立即使用，需要零配置。 您唯一需要做的就是添加自己的表情符号点击回调。 import React , { useState } from 'react' ; import Picker from 'em
emoji-picker-element：现代网络的轻量级表情符号选择器
02-04
表情符号选择器元素 < emoji> </ emoji> 作为Web组件分发的轻量级表情符号选择器。 特征： ... npm install emoji-picker-element import 'emoji-picker-element' ; 或作为[removed]标记： < sc
在做一个评论模块的时候，想在评论的内容添加一些emoji表情，
qian_li_hui的博客
04-24 573
在做一个评论模块的时候，想在评论的内容添加一些emoji表情，在网上搜了一堆之后，发现最适合的还是v-emoji-picker组件库。 首先是下载该库npm install v-emoji-picker(我这边前端的依赖管理用的是npm)下载完成后，你可以选择在全局使用该组件，也可以在某个页面使用。 话不多说，上效果图(可能视频转gif有点质量问题) 因为这个组件没有设置是否显示和隐藏的属性，所以我们可以使用vue的指令v-show 来使这个组件是否显示出来 <template> <d
Vue使用emoji表情包
热门推荐
西洲
07-30 1万+
1.资料库 vue组件库，有多个emoji相关的组件，根据需要选择一个。 vue组件库地址： https://vuejsexamples.com/tag/emoji/ 我选择的是vue-twemoji-picker vue组件地址： https://vuejsexamples.com/a-fast-plug-n-play-twitter-emoji-picker-for-vue/ github地址： https://github.com/kevinfaveri/vue-twemoji-pic
vue 限制表情符号_适用于Vue的快速即插即用Twitter表情符号选择器
cuk5239的博客
07-30 583
vue 限制表情符号 Vue-twemoji-picker (vue-twemoji-picker) A fast plug-n-play Twemoji Picker (+ optional textarea for Twemoji rendering) for Vue with search and recent emojis features! Supports latest emoji U...
【bug】vue.runtime.esm.js?2b0e:619 [Vue warn]: Failed to mount component: template or render function
花椒和蕊的博客
04-13 2477
遇到这个报错，算是一个比较小的问题 因为路由创建了，对应的页面刚新建，什么内容都还没有写 报了这个错 当页面正常有内容后，就不报错了
vue3项目打包构建后弹窗无法出现的问题解决
IU
01-10 985
【代码】vue3项目打包构建后弹窗无法出现的问题解决。
在vue3.0 如何使用vue-emoji-picker组件
03-29
1. 首先安装vue-emoji-picker组件 ``` npm install vue-emoji-picker --save ``` 2. 在需要使用该组件的Vue文件中引入组件 ```vue <template> <div> <vue-emoji-picker @select="onSelect"></vue-emoji-picker> </div> </template> <script> import VueEmojiPicker from 'vue-emoji-picker' export default { components: { VueEmojiPicker }, methods: { onSelect(emoji) { console.log('Selected emoji:', emoji) } } } </script> ``` 3. 在需要使用表情选择器的地方，使用`<vue-emoji-picker>`标签即可 4. 在组件中监听`select`事件，当用户选择表情时，会触发`select`事件，通过`onSelect`方法获取选择的表情。 5. 可以设置组件的属性来自定义表情选择器的显示方式和选项，具体可以参考vue-emoji-picker的文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值