近期在專案中使用v-model發生中文字被截斷的情形(例如:用注音輸入法輸入"我"這個字,會被切換成ㄨㄛˇ三個字元),這種情況用一般瀏覽器都不會發生,只有在使用手機輸入中文在等待選擇的情況下會發生。經查找相關資料後,確認該問題與事件 compositionstart
和 compositionend
有關係。compositionstart代表文字組合開始(例如:注音的我就分成,ㄨㄛˇ),compositionend代表文字組合結束,直到這時候才算是完整組成一個確定的文字。
解決方式(範例):
因為找了一些相關資料,發現v-model本身就已經支援了,目前尚未確認為何將該功能放到其他子組件且跑v-for去生成輸入框的情況下會發生。因此採用更妥善的方式來實作input。
參考資料:
https://developer.mozilla.org/zh-CN/docs/Web/Events/compositionstart