美文网首页
vue.js项目 评论留言模块支持表情包

vue.js项目 评论留言模块支持表情包

作者: aimee66 | 来源:发表于2019-05-01 10:30 被阅读0次

    vue.js项目 评论留言模块支持表情包

    需通过后台处理表情包:数据库存储字段,前端直接处理转换成表情。

    • 页面结构搭建:如图,页面布好文本域框和表情列表
      image.png
    image.png
    • 根据表情包的内容,转化成对应的描述和路径
      image.png
    • 文本域框中展示选中的表情包内容
      image.png
    image.png
    • 后台数据传入时,正则匹配替换相应的内容为表情
      image.png
    image.png

    注:如果需要不以图片的形式存本地,方法同上,把可以前端可以识别的表情 直接替换到图片路径,从服务器获取来的表情描述正则匹配替换时,直接替换成字符串,不需要以图片的形式加载。如果需要在文本域展示,需要在点击表情包,给文本域赋值的时候,文本域里的内容追加替换成表情包,另存一份内容为表情包对用的描述追加的文本域内容,存后台数据库的时候,存后面这一内容,而非文本域展示的内容。

    相关文章

      网友评论

          本文标题:vue.js项目 评论留言模块支持表情包

          本文链接:https://www.haomeiwen.com/subject/qxavnqtx.html