企业官网建设流程全解析

如图，鸿蒙中如果页面有多个输入框用户点击输入框的时候，点击后马上就会失去焦点。

1. HarmonyOS WebView 内核升级
2. setData diff 策略更激进
3. 微信基础库更新

是“鸿蒙 不支持输入态的受控组件反复重绘”
问题 代码

<input v-model="userAddress.detail" />

修改代码

export default { data() { return { // ================= 原有数据（未动） ================= address_id: 0, userAddress: { is_default: false }, // ================= 新增：input 显示用 ================= detailShow: '', realNameShow: '', phoneShow: '', // ================= 新增：input 临时值（非响应式） ================= detailTemp: '', realNameTemp: '', phoneTemp: '', }; }, methods: { // ================= 输入过程：只改临时变量 ================= onDetailInput(e) { this.detailTemp = e.detail.value; }, onRealNameInput(e) { this.realNameTemp = e.detail.value; }, onPhoneInput(e) { this.phoneTemp = e.detail.value; }, // ================= 失焦时：同步回 userAddress ================= syncDetail() { this.detailShow = this.detailTemp; this.userAddress.detail = this.detailTemp; }, syncRealName() { this.realNameShow = this.realNameTemp; this.userAddress.real_name = this.realNameTemp; }, syncPhone() { this.phoneShow = this.phoneTemp; this.userAddress.phone = this.phoneTemp; }, // ================= 原有方法（未动） ================= getUserAddress() { if (!this.address_id) return; getAddressDetail(this.address_id).then(res => { this.$set(this, 'userAddress', res.data); // ⭐ 初始化 input 显示值（关键） this.detailShow = res.data.detail || ''; this.realNameShow = res.data.real_name || ''; this.phoneShow = res.data.phone || ''; // 同步临时值 this.detailTemp = this.detailShow; this.realNameTemp = this.realNameShow; this.phoneTemp = this.phoneShow; }); }, } }

平台差异

总结一句话

问题不是 v-model，而是输入中频繁触发渲染。鸿蒙放大了问题，Android/iOS 虽然偶发但不稳。最佳实践是用临时变量 + blur 更新，实现跨平台安全输入。