中文输入状态下，造成多次触发input事件修改值出现问题

<template>
    <div class="dialogMan">
                <div class="relative wordInfo">
                    <el-input
                        ref="getfocus"
                        type="textarea"
                        :rows="6"
                        :value="wordInfo"
                        @input="wordInfoInput"
                        @change="wordInfoChange"
                        @compositionstart.native="compositionstart"
                        @compositionend.native="compositionend"
                        class="mt-10 no-select"
                    ></el-input>
    </div>
</template>
data() {
        return {
            wordInfo: '',
            wordInfoInputFlag: true
        }
    },
methods: {
        wordInfoInput(v) {
            requestIdleCallback(() => {
                if (this.wordInfoInputFlag) this.wordInfo = v
            })
        },
        compositionstart() {
            this.wordInfoInputFlag = false
        },
        compositionend() {
            this.wordInfoInputFlag = true
        }
    }