composition-xxx事件是input編輯框具有的事件

截屏2021-02-21 下午5.56.54.png

有時(shí)業(yè)務(wù)需求要在input事件之前攔截一些操作，就需要使用這兩個(gè)事件了

網(wǎng)上很多教程都是定義一個(gè)全局變量進(jìn)行控制，這樣代碼不僅多了難找，而且容易忘記

看vue在v-model源碼里的操作

input.addEventListener('input', function (e) {
   if(e.target.composing) return
  // do sth
})

input.addEventListener('compositionstart', function (e) {  
  e.target.composing = true
})

input.addEventListener('compositionend', function (e) {  
  if(!e.target.composing) return
  e.target.composing = false
  //do sth
})