小程序实时保存优化

背景。避免数据存储后丢失。要求实时保存。

• 问题：保存时出现卡断，输入的内容会被抹除。
• 问题原因。输入频繁速度块，会影响cpu处理速度。
• 解决方案。用户停止输入500ms后开始保存，否则不保存。

...
/** @change触发, dynamic-render中组件会监听改变将事件通知出来 */
<template><view class="exagree-container"><dynamic-renderref="dynamicRender"v-if="formConfConstruct.formModel":formModel="formConfConstruct.formModel.widgetList":formData="formConfConstruct.formData":readOnly="readOnly":formLogic="formConfConstruct.formModel.formLogic"@change="handleFormChange"></dynamic-render><!-- 提交按钮区域 --><view class="submit-section" v-if="!readOnly && formConfConstruct.formModel"><button type="submit" @click="debounceSubmit" class="submit-btn" :disabled="isSubmitting" :loading="isSubmitting">{{ isSubmitting ? '提交中...' : '提交' }}</button></view></view>
</template>
/** 监测数据实时更新 - 防抖优化 */
handleFormChange(formData) {// 清除之前的定时器if (this.saveTimer) {clearTimeout(this.saveTimer);}// 设置新的防抖定时器，500ms后执行保存this.saveTimer = setTimeout(() => {this.performSave(formData);}, 500);
},/** 执行实际的保存操作 */
performSave(formData) {// 如果正在保存中，跳过本次保存if (this.isSaving) {return;}// 检查数据有效性if (!formData || Object.keys(formData).length === 0) {return;}this.isSaving = true;saveFormDraft({formData: formData,id: this.draft?.id || '',applicantId: loginInfo.getLoginUser().userId,sceneType: 'executeAgreement'}).then((response) => {console.log('Draft saved successfully');}).catch((error) => {console.error('Error saving draft:', error);}).finally(() => {this.isSaving = false;});
},
...