【菜狗work前端】小程序加if判断时不及时刷新 vs Web

佛系菜狗2025-05-24 22:40

零、前提：

实现input输入数字不大于10000（需要配合type=number，maxlength=5，这里没写）

一、探究代码：

复制代码

 <input v-model="model1" @input="changeModel1" placeholder="请输入拒收件数"/>

const model1=ref(0)
const changeModel1=()=>{
    console.log('model1',model1.value)
    //是否去掉此处if判断
    if(model1.value>10000){
        console.log('model1>10000')
        model1.value = model1.value.slice(0, 4);
        console.log('model1',model1.value)
    }    
}

ps：vue2也试了一下，跟vue2还是vue3无关

二、探究结果：

1.web端/uniapp转微信小程序-未加if判断-及时更新

2.web端-加了if判断-及时更新

uniapp转微信小程序-加了if判断-未及时更新

三、AI分析原因：

四、解决方案：

解决uniapp转微信小程序-加了if判断-未及时更新：加一个nextTick(()=>{})即可

复制代码

import { ref, nextTick } from 'vue';

const changeModel1=()=>{
    if(model1.value>10000){
        nextTick(() => {
            model1.value = model1.value.slice(0, 4);
        }
    }    
}