【Vue3+Ts project】vant4 实现触发指定表单 rules校验、setTimeout和 setInterval 区别

news/2024/11/29 6:50:42/

 一.使用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

注意:setintervalsetTimeout返回的是一个定时器标识符,可以使用该标识符来清除相应的定时任务。


http://www.ppmy.cn/news/444562.html

相关文章

爬虫 | 王者荣耀高清壁纸-多线程

# CY3761 | 2021-11-04 18:23 import json import os import queue import time import urllibimport requestsfrom urllib import parse import threading from queue import Queue# 王者荣耀-官网 https://pvp.qq.com # 王者荣耀-高清壁纸 https://pvp.qq.com/web201605/wall…

华为鸿蒙系统能继承王者荣耀吗,华为鸿蒙玩王者荣耀账号互通吗?华为鸿蒙玩王者荣耀会不会影响?...

大家朝思暮想的华为鸿蒙系统终于发布了&#xff0c;很多用户都升级了&#xff0c;但是有些网友难免会担心华为鸿蒙系统玩王者荣耀会有所影响&#xff0c;最直接的影响便是账号不互通了&#xff0c;毕竟鸿蒙和安卓是两个系统。那么华为鸿蒙玩王者荣耀会不会影响呢&#xff1f;以…

Baumer工业相机堡盟工业相机如何通过BGAPISDK使用AutoFocusHelper自动对焦补充功能(C++)

Baumer工业相机堡盟工业相机如何通过BGAPISDK使用AutoFocusHelper自动对焦补充功能&#xff08;C&#xff09; Baumer工业相机Baumer工业相机BGAPISDK和AutoFocus功能的技术背景Baumer工业相机通过BGAPISDK使用AutoFocus功能1.引用合适的类文件2.通过BGAPISDK声明AutoFocusHelp…

多线程下载王者荣耀高清壁纸(过程超详细)

文章分为单线程和多线程两个部分&#xff0c;选择单线程一个一个下载速度会很慢&#xff0c;多线程下载可以明显提升速度。但先用单线程写出代码&#xff0c;再在此基础上改动成多线程&#xff0c;思路会更加清晰&#xff0c;对初学者也更加友好&#xff01; 单线程下载王者荣…

固态王者发布新品,继续引领技术升级!

2020年12月16日&#xff0c;在今日北京举行的2020英特尔内存存储日活动上&#xff0c;全球固态存储王者Intel重磅发布了六款全新内存和固态存储产品&#xff0c;对当前产品线进行了全面更新。 SSD D7-P5510-数据中心级NVMe&#xff0c;144L TLCSSD D5-P5316-数据中心级NVMe&…

王者荣耀官方壁纸图片批量下载器 pvp-wallpaper

王者荣耀官方壁纸图片批量下载器 pvp-wallpaper一、获取项目二、执行下载任务2.1 修改配置文件2.2 缓存列表2.3 执行下载 三、参考文档 pvp-wallpaper 最近想换一下电脑壁纸&#xff0c;换成王者荣耀主题的&#xff0c;网上搜了一下&#xff0c;保存了几张&#xff0c;但应用后…

用node爬下来所有王者荣耀的皮肤图片(做壁纸用)

本文仅供学习哦 需要转载请随意&#xff0c;记得标出处 2021年6/4日修改 先看看这帅气的图片 上代码,代码很简单 /*** 生成的图片文件会在本文件夹下的img文件里* 先把代码复制到一个js文件里。比如 down.js * 执行 node down.js 即可 * 会由于电脑硬盘速度和网络速度的原因…

13.IOC容器

IOC容器 IOC&#xff1a;Inversion of Control&#xff0c;翻译过来是反转控制 IOC思想 获取资源的传统方式&#xff1a;在应用程序中的组件需要获取资源时&#xff0c;传统的方式是组件主动的从容器中获取所需要的资源&#xff0c;在这样的模式下开发人员往往需要知道在具体…