【Vue3+Ts project】vant4 实现触发指定表单 rules校验、setTimeout和 setInterval 区别
使用validate触发指定表单效验方法 以及 seTimout 和 setInterval 之间详细区别
·
一.使用vant组件 validate属性 实现触发指定输入框rules校验,满足校验通过否则失败
1.给form表单绑定 ref并定义值名称 ,然后为你想校验的表单绑定 name值
<van-form ref="form">
<van-field name="mobilenNmber" v-model="mobile" :rules="[
{ required: true, message: '账号不能为空' },
{ pattern: /^(?:(?:\+|00)86)?1\d{10}$/, message: '请输入11位手机号' }
]"
></van-field>
</van-form>
2.为ref的值名称定义变量名 ,然后 ref值名称.value.validate('name值名称'),.then接收成功 , .catch 接收失败
<script setup lang="ts">
const form = ref()
form.value.validate('mobilenNmber').then((result: any) => {
console.log(result); //成功后执行
}).catch((err: any) => {
console.log(err); //失败后执行
});
</script>
二. setTimeout和 setInterval 区别
1.执行时间间隔
- setinterval: 会按照设定的时间 间隔循环执行,一直执行,直到被清除。
- setTimeout: 会在设定的时间 间隔之后 只执行一次
2.循环执行与单次执行
- setinterval:函数会按照设定的时间间隔周期性地重复执行,直到被清除。
- setTimeout:函数只会执行一次,执行后不会再重复执行。
3.函数触发时机
- setinterval:每个时间间隔过后立即触发函数执行。
- setTimeout:在设定的时间 间隔过后触发函数执行。
4.清除定时任务的方法
setInterval
的清除方法是clearInterval
,它接受一个参数,即setInterval
返回的定时器标识符。调用clearInterval
可以停止setInterval
循环执行。setTimeout
的清除方法是clearTimeout
,它接受一个参数,即setTimeout
返回的定时器标识符。调用clearTimeout
可以取消尚未执行的setTimeout
。
注意:setinterval和setTimeout返回的是一个定时器标识符,可以使用该标识符来清除相应的定时任务。
更多推荐
已为社区贡献6条内容
所有评论(0)