如上圖，在輸入中文的時候，通常會需要透過注音之類的輸入法來做拼字。通常 autocomplete 的套件沒有去處理輸入法拼字的問題，畢竟他們打英文不需要多一個注音拼字的動作嘛！
那這個時候要怎麼樣才能做到像 Google 搜尋一樣呢？
其實就是在拼字的時候，就把打在輸入框上面的資料丟出去即可。
Composition Event (組成事件):
透過 Composition Events 我們可以觀察使用者在輸入框內開啟輸入法 (Input Method Editor, IME) 時，組字或選字的狀態。
- compositionstart：輸入框內開啟輸入法，且正在拼字時觸發。
- compositionend：輸入框內開啟輸入法，且正在拼字或選字時更改了內容時觸發。
- compositionupdate：輸入框內開啟輸入法，拼字或選字完成，正要送出至輸入框時觸發。
所以要確認使用者輸入完成並送出文字時，就可以透過 compositionend 來做最後確認。
因為我是用 Vue 來寫，所以會用 Vue 的範例，如下
mounted() {
let isInputZh = false
const searchInput = this.$refs.Input.$el.children[0]
searchInput.addEventListener('compositionstart', function(e) {
isInputZh = true
}, false)
searchInput.addEventListener('compositionupdate', function(e) {
isInputZh = false
}, false)
searchInput.addEventListener('compositionend', function(e) {
isInputZh = false
}, false)
searchInput.addEventListener('input', function(e) {
if (isInputZh) return
remoteApiMethod(this.value)
}, false)
}用這種方式就可以在輸入法尚未結束的時候丟資料去 API 取資料嘍～
