小程序输入框带表情的组件(黑白版)

组件代码:
// components/Test/Test.js

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    value: String, // 输入框的值
  },

  /**
   * 组件的初始数据
   */
  data: {
    emojis: [],
  },

  /**
   * 组件的方法列表
   */
  methods: {
      // 点击表情
      onTapEmoji: function(e) {
        console.log("eeeee",e);
        const {
          currentTarget: {
            dataset: {
              emoji
            }
          }
        } = e;
        const {
          value
        } = this.properties;
        this.triggerEvent('clickEmoji', {
          emoji: emoji,
          value: value + emoji
        })
      },
      
  },


  lifetimes: {
    attached: function() {
      const _high = 55357;
      const _low = 56832;
      const _nums = 18;
      const emojis = [];
      for (let i = 0; i < _nums; i++) {
        const U_high = "%u" + _high.toString(16)
        const U_low = "%u" + (_low + i).toString(16)
        emojis.push(unescape(U_high + U_low))
      }
      this.setData({
        emojis
      })
      console.log("emojis:",emojis);
    },
  }
})

// components/Test/Test.json

{
  "component": true,
  "usingComponents": {}
}

// components/Test/Test.wxml

<view wx:for="{{emojis}}" wx:for-item="item" style="display: inline-flex;flex-direction:row;justify-content: space-between;" >
  <view  style="width:50px;display:inline-block" bindtap="onTapEmoji" data-emoji="{{item}}" >{{item}}</view>
</view>

引用代码:
//page/index/index.js

...
  clickEmoji: function(e) {
    console.log("eee:",e);
    const {
      detail: {
        value
      }
    } = e;

    
    this.setData({
      textareaValue: value
    })
  },
  onInputTextarea: function(e) {
    const {
      detail: {
        value
      }
    } = e;
    this.setData({
      textareaValue: value
    })
  },
...

//page/index/index.json

{
  "usingComponents": {
    "emoji": "./components/Test/Test"
  }
}

//page/index/index.wxml

<textarea value="{{textareaValue}}" bindinput="onInputTextarea"></textarea>

                
                <emoji bind:clickEmoji="clickEmoji" value="{{textareaValue}}" />