微信小程序利用腾讯云IM即时通讯表情开发

上一节我们完成了消息收发 这次我们补充表情发送；
其实表情跟普通文字消息发送一样；话不多说先上图走一波；我儿豁！

微信图片_20190816115653.png

第一步当然是寻找表情素材

1 .第一步就是要先找到表情包了，因为开发时间的原因我这里直接找的是文字表情。而不是图片(png,jpg,gif)格式的表情。文字表情比较方便跟文字一起输入做处理。这个地址里面的表情应该够用了，http://www.oicqzone.com/tool/emoji/，复制最后一列的黑色图标

 // 表情数组
    emojiChar: ["😁", "😋", "😜", "😉", "😌", "😅", "😳", "😊", "😝", "😰", "😠", "😩", "😲", "😞", "😭", "😍", "😖", "😱", "😡", "😚", "😤"],

2 定义好之后用wx:for在页面中渲染出来。

<view class='emoji-con' wx:if="{{isShowModelUp}}">
        <block wx:for="{{emojiChar}}" wx:key="{{index}}">
          <view class='emoji' bindtap='selectEmoji' data-text="{{item}}">
            <text>{{item}}</text>
          </view>
        </block> 
      </view>

3.定义选择表情的事件，事件处理，与input的值相加,然后调用发送文字消息方法，完成！！

// 表情选择
  selectEmoji(e){
    this.setData({
      inputValue: this.data.inputValue + e.currentTarget.dataset.text,
      isShowModelUp:false
    })
  },

由于发送表情跟普通文字一样，所有到这里都完了。