当前位置: 首页 > news >正文

【Vue中给输入框加入js验证_blur失去焦点进行校验】

【Vue中给输入框加入js验证_blur失去焦点进行校验】
通俗一点就是给输入框加个光标离开当前文本输入框时,然后对当前文本框内容进行校验判断
具体如下:
1.先给文本框加属性 @blur=“validatePhoneNumber”

<el-input v-model=“entity.telephone” @blur=“validatePhoneNumber” :disabled=“disabled”>

{{ errorText }}



2.在data中对需要值进行默认赋值,或者称之为自定义
在这里插入图片描述

telephone:‘’,
phoneNumber: ‘’,
isValid: true,
errorText: ‘请输入正确的手机号码’ ,
isPhoneValid: true,
3.在method中自定义校验的方法
在这里插入图片描述

 validatePhoneNumber() {  const resg1=/^1[3456789]\d{9}$/;this.isValid = resg1.test(this.entity.telephone);  if (!this.isValid) {  alert(this.errorText);  }  
} 

相关文章:

【Vue中给输入框加入js验证_blur失去焦点进行校验】

【Vue中给输入框加入js验证_blur失去焦点进行校验】 通俗一点就是给输入框加个光标离开当前文本输入框时&#xff0c;然后对当前文本框内容进行校验判断 具体如下&#xff1a; 1.先给文本框加属性 blur“validatePhoneNumber” <el-input v-model“entity.telephone” blur…...

vue3项目引入电子签名(可横屏竖屏)

实现效果&#xff1a;&#xff08;左边横屏&#xff0c;右边竖屏&#xff09; 前言&#xff1a;【使用开源项目smooth-signature 实现签名的功能。Gitee 地址是 &#xff1a;GitHub - linjc/smooth-signature: H5带笔锋手写签名&#xff0c;支持PC端和移动端&#xff0c;任何前…...

mysql中count(*)、count(1)、count(主键)、count(字段)的区别

文章目录 count函数的语义count(主键)count(1)count(*)count(字段)替代方案explain或者show table status中间表或者其他数据库计数 以下分析都是基于 select count(?) from table 这个语句来分析&#xff0c;不带过滤条件。 count函数的语义 count() 是一个聚合函数&#x…...

Nginx生成自签名证书从而添加域名的HTTPS访问

数字证书 ## 原理参考 https://mysticaldream.github.io/2023/05/certificate/## https://blog.csdn.net/m0_52440465/article/details/130713591 简介 数字证书是由证书颁发机构(CA)签名并颁发的电子文件,用于建立网络连接的身份认证和加密通信。SSL 证书是数字证书的一种。…...

无框架Java转go语言写http与tcp请求

项目地址 https://github.com/cmdch2017/http_tcpServer 项目结构 如何快速上手 http篇 1、controller包就相当于RestController&#xff0c;这里返回了一个Person对象&#xff0c;当你需要新建一个接口时&#xff0c;再新写一个func仿照下面的方法就行了 package control…...

【Git】Git基本操作

文章目录 Git 是什么Git 的优点Git 安装Linux UbuntuLinux CentOsWindows Git 基本操作1. 创建 Git 本地仓库2. 配置 Git3. Git工作区、暂存区和版本库4. 添加文件5. 查看 .git 文件6. 修改文件7. 版本回退 Git 是什么 Git是一个免费的、开源的分布式版本控制系统&#xff0c;…...

JavaSE学习笔记 Day20

JavaSE学习笔记 Day20 个人整理非商业用途&#xff0c;欢迎探讨与指正&#xff01;&#xff01; 上一篇 文章目录 JavaSE学习笔记 Day20十七、数据结构与算法17.1算法17.1.1冒泡排序17.1.2选择排序17.1.3插入排序17.1.4三个排序的区别 17.2顺序表17.2.1顺序表代码实现17.2.2顺…...

【蓝桥杯选拔赛真题52】python空调模式 第十四届青少年组蓝桥杯python 选拔赛比赛真题解析

目录 python空调模式 一、题目要求 1、编程实现 2、输入输出...

Android Studio: 解决Gradle sync failed 错误

文章目录 1. 前言2. 错误情况3. 解决办法3.1 获取gradle下载地址3.2 获取gradle存放目录3.3 替换并删除临时文件3.4 触发Try Again 4. 执行成功 1. 前言 今天调试项目&#xff0c;发现新装的AS&#xff0c;在下载gradle的过程中&#xff0c;一直显示连接失败&#xff0c;Gradl…...

【手写数据库】从零开始手写数据库内核,行列混合存储模型,学习大纲成型了

目录 ​专栏内容: 参天引擎内核架构 本专栏一起来聊聊参天引擎内核架构,以及如何实现多机的数据库节点的多读多写,与传统主备,MPP的区别,技术难点的分析,数据元数据同步,多主节点的情况下对故障容灾的支持。 手写数据库toadb 本专栏主要介绍如何从零开发,开发的步骤,以…...

机器学习中的一些经典理论定理

PAC学习理论 当使用机器学习方法来解决某个特定问题时&#xff0c;通常靠经验或者多次试验来选择合适的模型、训练样本数量以及学习算法收敛的速度等。但是经验判断或多次试验往往成本比较高&#xff0c;也不太可靠&#xff0c;因此希望有一套理论能够分析问题难度、计算模型能…...

c语言:成本100元,40%的利润怎么计算|练习题

一、利润的计算公式&#xff1a; 利润售价-成本 售价成本/(1-利润率) 二、用c语言代码表示为&#xff1a; 如图&#xff1a; 三、计算源代码【带注释】 #include <stdio.h> int main() { float cost;//成本变量 int prof_rate;//利润率变量 float price;//…...

【Python必做100题】之第二十二题(复制列表)

题目&#xff1a;将一个列表的数据复制到另一个列表中 重点&#xff1a;确保复制到位要导入copy方法进行深度复制 代码如下&#xff1a; #将一个列表的数据复制到另一个列表中 import copy list [1,2,3,4] print(list) list1 copy.copy(list) list[0] 30 print(list) pri…...

Java 数据结构篇-实现堆的核心方法与堆的应用(实现 TOP-K 问题:最小 k 个数)

&#x1f525;博客主页&#xff1a; 【小扳_-CSDN博客】 ❤感谢大家点赞&#x1f44d;收藏⭐评论✍ 文章目录 1.0 堆的说明 2.0 堆的成员变量及其构造方法 3.0 实现堆的核心方法 3.1 实现堆的核心方法 - 获取堆顶元素 peek() 3.2 实现堆的核心方法 - 下潜 down(int i) 3.3 实…...

startUML6.0.1破解方法

startUML6.0.1破解方法 文章目录 startUML6.0.1破解方法1.startUML6.0.1快速破解2.概述3.安装Nodejs4.安装asar5.修改app.asar中的源码6.将修改后的源码重新压缩7.覆盖官方的asar文件8.重启startUML9.参考文档 1.startUML6.0.1快速破解 后绪步骤可以不看&#xff0c;直接下载我…...

Python实现多种图像分割方法:基于阈值分割和基于区域分割

Python实现多种图像分割方法&#xff1a;基于阈值分割和基于区域分割 图像分割是图像分析的第一步&#xff0c;是计算机视觉的基础&#xff0c;但也是图像处理中最困难的问题之一。经典的计算机视觉任务&#xff0c;如目标检测、图像识别等都和图像分割相关&#xff0c;图像分…...

SQL学习笔记+MySQL+SQLyog工具教程

文章目录 1、前言2、SQL基本语言及其操作2.1、CREATE TABLE – 创建表2.2、DROP TABLE – 删除表2.3、INSERT – 插入数据2.4、SELECT – 查询数据2.5、SELECTDISTINCT – 去除重复值后查询数据2.6、SELECTWHERE – 条件过滤2.7、AND & OR – 运算符2.8、ORDER BY – 排序2…...

SpringBoot的日志管理

&#x1f648;作者简介&#xff1a;练习时长两年半的Java up主 &#x1f649;个人主页&#xff1a;程序员老茶 &#x1f64a; ps:点赞&#x1f44d;是免费的&#xff0c;却可以让写博客的作者开心好久好久&#x1f60e; &#x1f4da;系列专栏&#xff1a;Java全栈&#xff0c;…...

leetcode---76. 最小覆盖子串 [C++/滑动窗口+哈希表]

原题&#xff1a;76. 最小覆盖子串 - 力扣&#xff08;LeetCode&#xff09; 题目解析&#xff1a; 此题在这道题的基础上进行理解会更简单 leetcode --- 30. 串联所有单词的子串[C 滑动窗口/双指针]-CSDN博客 本题要求在s字符串中找到含有t字符串所有字符的最短子串。 也就是…...

Kafka 分级存储在腾讯云的实践与演进

导语 腾讯云消息队列 Kafka 内核负责人鲁仕林为大家带来了《Kafka 分级存储在腾讯云的实践与演进》的精彩分享&#xff0c;从 Kafka 架构遇到的问题与挑战、Kafka 弹性架构方案类比、Kafka 分级存储架构及原理以及腾讯云的落地与实践四个方面详细分享了 Kafka 分级存储在腾讯云…...

Kotlin原生AI Agent框架Koog:多平台、类型安全与生产级实践

1. 从零到一&#xff1a;为什么我们需要一个Kotlin原生的AI Agent框架&#xff1f;如果你是一个长期在JVM生态&#xff0c;特别是Kotlin世界里摸爬滚打的开发者&#xff0c;过去一年里&#xff0c;你肯定没少跟各种AI SDK打交道。无论是OpenAI的官方库&#xff0c;还是LangChai…...

不删除属性的情况下简化对象属性的方法探讨

是否还有其他方法可以简化从对象中删除特定属性的操作。舍友提出了一个对象属性简化的问题&#xff0c;询问在不删除属性的情况下&#xff0c;如何简化从对象中删除特定属性的操作。02解决方案最初&#xff0c;我曾考虑过不直接删除属性&#xff0c;而是仅保留业务所需的那些。…...

收藏!AI时代程序员转型指南:从纯编码到人机协同高手

本文揭示了AI对程序员行业的深刻变革&#xff1a;初级编码岗需求锐减&#xff0c;而AI协作、架构师等高端岗位需求激增。文章提出两个阶段提升竞争力&#xff1a;第一阶段掌握AI工具栈&#xff08;编码助手、调试工具等&#xff09;并遵循人机协同法则&#xff1b;第二阶段构建…...

SMD电阻脉冲负载能力解析与工程实践

1. SMD电阻脉冲负载能力解析&#xff1a;工程师必须掌握的核心知识在工业控制板卡维修现场&#xff0c;我曾遇到一个令人费解的案例&#xff1a;某型号PLC的输入保护电路在雷雨季节频繁损坏&#xff0c;但检查发现所有元件参数都符合设计要求。最终用热成像仪捕捉到瞬间现象——…...

抖音无水印下载器:终极免费批量下载工具完全指南

抖音无水印下载器&#xff1a;终极免费批量下载工具完全指南 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and browser fallback support. 抖…...

Tempera风格+古典画框+羊皮纸基底=高转化商业图?:电商视觉团队实测ROI提升210%的紧急部署方案

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;Tempera风格古典画框羊皮纸基底高转化商业图&#xff1f;&#xff1a;电商视觉团队实测ROI提升210%的紧急部署方案 在Q3大促前72小时&#xff0c;某头部服饰品牌视觉中台紧急启用Tempera风格渲染管线&a…...

基于Jina Reader与Exa API的免费网页抓取与搜索工具实践

1. 项目概述&#xff1a;一个轻量级的网络信息抓取与处理工具最近在折腾一些自动化信息处理的项目&#xff0c;发现很多时候需要从网上快速抓取内容或者进行关键词搜索&#xff0c;然后对结果进行结构化处理。市面上的工具要么太重&#xff0c;要么收费&#xff0c;要么就是API…...

芯片设计人才培养:从Sondrel模式看产学合作如何弥合能力鸿沟

1. 项目背景与行业契机最近在整理行业资料时&#xff0c;翻到一篇十多年前的旧闻&#xff0c;讲的是英国一家名为Sondrel的系统级芯片设计咨询公司&#xff0c;与宁波诺丁汉大学合作&#xff0c;启动了一个针对中国学生的芯片设计人才培养项目。这件事发生在2013年&#xff0c;…...

Claude Code环境变量配置全解析:从入门到精通

1. 项目概述&#xff1a;Claude Code 环境变量配置生成器如果你和我一样&#xff0c;是 Claude Code 的深度用户&#xff0c;那你一定经历过这样的时刻&#xff1a;面对一个复杂的开发任务&#xff0c;想调整一下模型的思考深度&#xff08;Effort Level&#xff09;来平衡成本…...

智慧港口高风险作业AI实时监督技术实操解析

在智慧港口建设中&#xff0c;集装箱堆场、高风险作业的安全管控是核心重点&#xff0c;其中皮带运输、高风险作业&#xff08;吊装、动火、高处、有限空间等&#xff09;的安全保障&#xff0c;是港口运维的关键。当前&#xff0c;港口高风险作业普遍面临痛点&#xff1a;人工…...