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

零、前提:

实现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);
        }
    }    
}
相关推荐
走,带你去玩4 小时前
uniapp 微信小程序水印
微信小程序·小程序·uni-app
是一碗螺丝粉4 小时前
🔥 微信H5视频自动播放终极秘籍:WeixinJSBridge竟是官方“通行证”?
微信小程序
一笑code5 小时前
vue/微信小程序/h5 实现react的boundary
微信小程序·vue·react
菌菇汤6 小时前
uni-app实现单选,多选也能搜索,勾选,选择,回显
前端·javascript·vue.js·微信小程序·uni-app·app
666HZ66619 小时前
微信小程序中scss、ts、wxml
微信小程序·小程序·scss
牧杉-惊蛰20 小时前
uniapp微信小程序css中background-image失效问题
css·微信小程序·uni-app
拼图2091 天前
微信小程序——skyline版本问题
微信小程序·小程序
mg6681 天前
微信小程序入门实例_____打造你的专属单词速记小程序
微信小程序·小程序
程序员陆通1 天前
Vibe Coding开发微信小程序实战案例
微信小程序·小程序·notepad++·ai编程
nbsaas-boot1 天前
[特殊字符] 分享裂变新姿势:用 UniApp + Vue3 玩转小程序页面分享跳转!
小程序·uniapp·notepad++