【uniapp开发小程序】实现粘贴一段文字后,自动识别到姓名/手机号/收货地址

一、需求

在uni-app中开发小程序,实现粘贴一段文字后自动识别到手机号,并将手机号前面的内容作为姓名,手机号后面的内容作为收货地址,并去除其中的特殊字符和前缀标识。

实现效果:
在这里插入图片描述
在这里插入图片描述

二、实现方式:

<template><view class=""><view  @click="pasteContent()">试试粘贴收件人姓名/手机号/收货地址,可快速识别 您的收货信息</view></view>
</template><script>export default {data() {return {addressData: {name: '',phone: '',details: '', //详细地址},}},methods: {//获取到剪切板的内容,快速识别收货地址pasteContent() {var that = thisuni.getClipboardData({success: (res) => {const text = res.data;const phoneNumber = this.extractPhoneNumber(text);const name = this.extractName(text, phoneNumber);const address = this.extractAddress(text, phoneNumber);// 去除特殊字符和前缀标识const cleanedName = this.cleanText(name);const cleanedPhoneNumber = this.cleanText(phoneNumber);const cleanedAddress = this.cleanText(address);// 在这里可以对姓名、手机号和收货地址进行处理// 例如,将提取到的信息填充到表单中console.log('姓名:', cleanedName);console.log('手机号:', cleanedPhoneNumber);console.log('收货地址:', cleanedAddress);if (cleanedName != '') {that.addressData.name = cleanedName}if (cleanedPhoneNumber != '') {that.addressData.phone = cleanedPhoneNumber}if (cleanedAddress != '') {that.addressData.details = cleanedAddress}}});},//1姓名extractPhoneNumber(text) {const reg = /\d{11}/;const match = text.match(reg);const phoneNumber = match ? match[0] : '';return phoneNumber;},//2手机号extractName(text, phoneNumber) {const index = text.indexOf(phoneNumber);const name = index > 0 ? text.substring(0, index).trim() : '';return name;},//3地址extractAddress(text, phoneNumber) {const index = text.indexOf(phoneNumber);const address = index > 0 ? text.substring(index + phoneNumber.length).trim() : '';return address;},// 4去除特殊字符和前缀标识cleanText(text) {const cleanedText = text.replace(/\/|姓名:|手机号:|收货地址:|地址:/g, '');return cleanedText;},}}
</script>

到这里就完成啦~ok

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/7283.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

154个Bug!

持续测试了一个月的H5项目&#xff0c;终于迎来了上线日&#xff0c;在测试H5的过程中&#xff0c;遇到了一些坑&#xff0c;积累了些许经验&#xff0c;想着分享一下&#xff0c;希望对大家有所启发。 主要从以下一个方面展开&#xff1a; 一、项目背景 二、测试环境准备 三…

Ubuntu系统安装JDK教程

今天新买了一台阿里云服务器&#xff0c;因为centos 不提供了更新支持&#xff0c;所以Linux系统选择了Ubuntu 系统&#xff0c;今天就出一期 Ubuntu上安装的一系列教程&#xff0c;今天就先从JDK开始。 Ubuntu系统安装JDK教程 1、 jdk下载2、安装 lrzsz 命令 &#xff08;仅限…

【Cache】Squid代理服务器应用

文章目录 一、Squid 服务器的概念1. 代理服务器概述CDN 服务器 2. 代理的工作机制3. Squid 服务器的作用4. Squid 代理的类型 二、部署 Squid 服务器1. 安装 Squid 服务1.1 编译安装 Squid1.2 修改 Squid 的配置文件1.3 Squid 的运行控制1.4 创建 Squid 服务脚本1.5 supervisor…

均方误差,交叉熵损失函数举例计算

目录 Classification Error&#xff08;分类错误率&#xff09; Mean Squared Error (均方误差) 交叉熵损失函数 我们希望根据图片动物的轮廓、颜色等特征&#xff0c;来预测动物的类别&#xff0c;有三种可预测类别&#xff1a;猫、狗、猪。假设我们当前有两个模型&#xff0…

Appium: Windows系统桌面应用自动化测试(一)

Appium: Windows系统桌面应用自动化测试 一、方案调研二、环境搭建1、WinAppDriver环境搭建&#xff08;1&#xff09;开启开发者选项中的“开发人员模式”&#xff08;2&#xff09;windows sdk下载安装&#xff08;3&#xff09;WinAppDriver下载安装 2、appium环境搭建&…

开发者活动:云原生的开源 AI 大模型基础设施

随着 ChatGPT 的火热&#xff0c;大语言模型和相关应用不断涌现。你是否了解大语言模型的技术细节&#xff1f;你是否曾经开发过大语言模型应用&#xff1f;如果你对大语言模型背后的基础设施感兴趣&#xff0c;那么7月8号&#xff0c;北京海淀中关村创业大街&#xff0c;云原生…

Jmeter接口测试参数化详解

目录 前言&#xff1a; RandomString函数 CSVRead函数 CSV Data Set Config配置元件 前言&#xff1a; 在进行接口测试时&#xff0c;参数化是一项重要的技术&#xff0c;可以帮助测试人员有效地模拟不同的场景和数据&#xff0c;增加测试用例的覆盖范围。JMeter提供了多种…

十七、docker学习-docker-compose安装nginx反向代理

compose安装nginx反向代理 IDEA安装docker插件 idea安装docker插件。Dockerfile、docker-compose.yml文件大部分内容会有提示信息。方便开发人员编写配置文件。 https://plugins.jetbrains.com/plugin/7724-docker/versions基础镜像 docker pull 1.21.0-alpine docker pull…

1.1、Java初级认识Java、jdk、 idea

前言 1.1 软件开发之 Java 开发 Java现在已经占有主流市场 企业级应用领域&#xff08;JavaEE 后台&#xff09;&#xff1a;用来开发企业级的应用程序&#xff0c;大型网站如淘宝、京 东、12306&#xff0c;以及各大物流、银行、金融、社交、医疗、交通、各种 OA 系统等都…

Proxyman 替换js

在真机排查问题时&#xff0c;js不能格式化&#xff0c;导致没法看问题出在那一行&#xff0c;此时可以用这个方法替换js。 方法&#xff1a; 安装proxyman后&#xff0c;以iOS设备为例&#xff0c;菜单-证书-在iOS上安装证书 电脑、真机连接同一个网络&#xff0c;配置代理&…

1. MyBatis 整体架构

作为正式内容的第一篇&#xff0c;本次不会介绍具体的技术&#xff0c;而是先从全局视角上对 MyBatis 做一个俯瞰&#xff0c;了解 MyBatis 项目工程的组织结构&#xff0c;以及内部的核心功能模块。 工程结构 打开 MyBatis 的 Github 地址&#xff0c;就可以看到其代码工程结…