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

uniapp使用easyinput文本框显示输入的字数和限制的字数

uniapp使用easyinput文本框显示输入的字数和限制的字数

先上效果图:
在这里插入图片描述
整体代码如下:

<template><view class="nameInfoContent"><uni-easyinput class="uni-mt-5" suffixIcon="checkmarkempty" v-model="memberName" placeholder="请输入新昵称"maxlength="24" @iconClick="submit" @input="handleInput"></uni-easyinput><view class="wordsNum"><view class="tipLips">支持2-24位中英文数字,符号-和_</view><view class="juedui">{{ inputValueLength ? inputValueLength : 0  }}/24 </view></view></view>
</template><script>export default {data() {return {memberName: '',inputValueLength: ''}},methods: {handleInput(e) {this.inputValueLength = parseInt(e.length);}}}
</script><style lang="scss" scoped>.nameInfoContent {position: relative;padding: 32rpx;min-height: calc(100vh - 152rpx);.wordsNum {display: flex;justify-content: space-between;margin-top: 24rpx;.tipLips,.juedui {font-size: 24rpx;color: #999999;}}}
</style>

Live life to the fullest by drawing on your strengths.

相关文章:

uniapp使用easyinput文本框显示输入的字数和限制的字数

uniapp使用easyinput文本框显示输入的字数和限制的字数 先上效果图&#xff1a; 整体代码如下&#xff1a; <template><view class"nameInfoContent"><uni-easyinput class"uni-mt-5" suffixIcon"checkmarkempty" v-model&quo…...

蓝牙技术的多种模式详解

蓝牙作为一种广泛应用的无线通信技术&#xff0c;已经在我们的日常生活中无处不在。随着技术的发展&#xff0c;蓝牙已经不再仅限于传统的音频传输&#xff0c;而是扩展到了各种应用领域。本文将深入探讨蓝牙的各种模式及其应用场景。 1. 经典蓝牙&#xff08;BR/EDR&#xff…...

攻防世界-流量分析WP

流量分析1来自 <攻防世界> 题目描述:流量分析&#xff0c;你知道这堆流量做了什么事情吗&#xff0c;你能恢复出来flag吗&#xff1f; 1&#xff0c;首先查看IPv4统计信息 如果该流量记录的是黑客的攻击行为产生的流量&#xff0c;那么出现频率最高的流量应该来自攻击者…...

打印爱心型

#include<stdio.h> int main() { printf("\n\n\n"); //输出梯形 // printf("\033{31m"); int t0,i0,j0; for (i 0; i <3; i)//输出行数 { for (t 1; t<5-i*2;t)//输出空格 printf(" "); …...

WASM 使用说明23事(RUST实现)

文章目录 1. wasm是什么1.1 chatgpt定义如下:1.2 wasm关键特性&#xff1a; 2. wasm demo2.1 cargo 创建项目2.2 编写code2.3 安装wasm-pack2.4 编译 3.1 html页面引用wasm代码&#xff08;js引用&#xff09;3.2 访问页面4 导入js function4.1 编写lib.rs文件&#xff0c;内容…...

Visual studio 下载安装

1&#xff0c;Visual stutdio 网址 下载 Visual Studio Tools - 免费安装 Windows、Mac、Linux 2&#xff0c;下划页面&#xff0c;点击 较早的下载 3&#xff0c;选择对应的版本进行下载...

jEasyUI 创建自定义视图

jEasyUI 创建自定义视图 jEasyUI&#xff08;jQuery EasyUI&#xff09;是一个基于jQuery的用户界面插件集合&#xff0c;它为用户提供了一系列的UI组件&#xff0c;如菜单、窗口、表格等&#xff0c;使得Web界面的开发变得更加简单快捷。在本文中&#xff0c;我们将探讨如何使…...

SpringMVC6-SpringMVC的视图

目录 ThymeleafView 转发视图 重定向视图 视图控制器view-controller SpringMVC中的视图是View接口&#xff0c;视图的作用&#xff1a;渲染数据&#xff0c;将模型Model中的数据展示给用户 SpringMVC视图的种类很多&#xff0c;默认有转发视图InternalResourceView 和重定…...

echarts给Y轴的不同轴线设置不同的颜色的样式

官方文档 option {xAxis: {type: category,data: [Mon, Tue, Wed, Thu, Fri, Sat, Sun]},yAxis: {type: value},series: [{data: [150, 230, 224, 218, 135, 147, 260],type: line,}] }; 效果&#xff1a; 需要添加参数markLine option {xAxis: {type: category,data: [M…...

从0到1构建 UniApp + Vue3 + TypeScript 移动端跨平台开源脚手架

&#x1f680; 作者主页&#xff1a; 有来技术 &#x1f525; 开源项目&#xff1a; youlai-mall &#x1f343; vue3-element-admin &#x1f343; youlai-boot &#x1f343; vue-uniapp-template &#x1f33a; 仓库主页&#xff1a; GitCode&#x1f4ab; Gitee &#x1f…...

论文笔记:LaDe: The First Comprehensive Last-mile Delivery Dataset from Industry

2023 KDD 1 intro 1.1 背景 随着城市化进程的加快和电子商务的发展&#xff0c;最后一公里配送已成为一个关键的研究领域 最后一公里配送&#xff0c;如图1所示&#xff0c;是指连接配送中心和客户的包裹运输过程&#xff0c;包括包裹的取件和配送除了对客户满意度至关重要外…...

无用的知识又增加了-静态二值贝叶斯滤波

静态二值贝叶斯滤波 静态二值贝叶斯滤波&#xff08;Static Binary Bayes Filter&#xff09;是一种用于处理二值状态&#xff08;例如&#xff0c;目标存在或不存在&#xff09;的简单贝叶斯滤波器。这种滤波器通常应用于目标检测、传感器融合等场景&#xff0c;其中状态空间…...

cesium相机(camera)控制

camera基础属性&#xff1a; Cesium 中的相机通过 viewer.camera 来获取和操作。 position:相机的位置,用 Cartesian3 坐标表示&#xff0c;表示的是相机在世界坐标系中的绝对位置。 viewer.camera.position Cesium.Cartesian3.fromDegrees(longitude, latitude, height);dir…...

Java 反射

一、基本概念 Java反射机制是Java语言的一种动态特性&#xff0c;允许程序在运行时检查和操作类、接口、字段和方法。反射机制使得Java程序可以在运行时获取关于类的详细信息&#xff0c;并且可以动态地调用类的方法、访问类的字段等。反射机制主要涉及以下几个核心类和接口&a…...

【目标检测01】真实框、预测框、锚框和交并比IoU

文章目录 1. 任务定义2. 基本概念2.1 边界框&#xff08;bounding box&#xff09;2.2 真实框、预测框和锚框2.3 交并比 (IoU)2.4 代码实现 1. 任务定义 目标检测的主要目的是让计算机可以自动识别图片或者视频帧中所有目标的类别&#xff0c;并在该目标周围绘制边界框&#x…...

青少年编程能力等级测评CPA C++五级试卷(2)

青少年编程能力等级测评CPA C++五级试卷(2) 一、单项选择题(共15题,每题3分,共45分) CP5_2_1.下列有关类的重用方法的叙述中,不正确的是( )。 A.类的继承可以实现类的重用 B.类的组合可以实现类的重用 C.类的封装可以实现类的重用 D.类的继承和类的组合都可…...

SATA数据线

SATA 数据线&#xff08;Serial ATA 数据线&#xff09;是一种用于连接计算机主板与存储设备&#xff08;如硬盘、固态硬盘和光驱&#xff09;的线缆。它的主要作用是传输数据&#xff0c;允许计算机与这些设备之间进行高效的数据交换。 主要作用 数据传输&#xff1a;SATA 数…...

《云原生安全攻防》-- K8s攻击案例:权限维持的攻击手法

在本节课程中&#xff0c;我们将一起深入了解K8s权限维持的攻击手法&#xff0c;通过研究这些攻击手法的技术细节&#xff0c;来更好地认识K8s权限维持所带来的安全风险。 在这个课程中&#xff0c;我们将学习以下内容&#xff1a; K8s权限维持&#xff1a;简单介绍K8s权限维持…...

回溯算法-Java【力扣】【算法学习day.14】

前言 ###我做这类文档一个重要的目的还是给正在学习的大家提供方向&#xff08;例如想要掌握基础用法&#xff0c;该刷哪些题&#xff1f;&#xff09;我的解析也不会做的非常详细&#xff0c;只会提供思路和一些关键点&#xff0c;力扣上的大佬们的题解质量是非常非常高滴&am…...

从本地到云端:跨用户请求问题的完美解决方案

对于某些单个请求或响应中含有多个用户信息的服务&#xff0c;SDK提供了一套基于统一的UCS拆分和聚合的解决方案供开发者使用。 请求拆分 对于跨用户服务的请求&#xff0c;我们提供了两个处理方案&#xff1a; 【1】根据用户信息拆分请求&#xff1a; 场景&#xff1a;请求内…...

装饰模式(Decorator Pattern)重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

关于nvm与node.js

1 安装nvm 安装过程中手动修改 nvm的安装路径&#xff0c; 以及修改 通过nvm安装node后正在使用的node的存放目录【这句话可能难以理解&#xff0c;但接着往下看你就了然了】 2 修改nvm中settings.txt文件配置 nvm安装成功后&#xff0c;通常在该文件中会出现以下配置&…...

在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module

1、为什么要修改 CONNECT 报文&#xff1f; 多租户隔离&#xff1a;自动为接入设备追加租户前缀&#xff0c;后端按 ClientID 拆分队列。零代码鉴权&#xff1a;将入站用户名替换为 OAuth Access-Token&#xff0c;后端 Broker 统一校验。灰度发布&#xff1a;根据 IP/地理位写…...

如何将联系人从 iPhone 转移到 Android

从 iPhone 换到 Android 手机时&#xff0c;你可能需要保留重要的数据&#xff0c;例如通讯录。好在&#xff0c;将通讯录从 iPhone 转移到 Android 手机非常简单&#xff0c;你可以从本文中学习 6 种可靠的方法&#xff0c;确保随时保持连接&#xff0c;不错过任何信息。 第 1…...

2025盘古石杯决赛【手机取证】

前言 第三届盘古石杯国际电子数据取证大赛决赛 最后一题没有解出来&#xff0c;实在找不到&#xff0c;希望有大佬教一下我。 还有就会议时间&#xff0c;我感觉不是图片时间&#xff0c;因为在电脑看到是其他时间用老会议系统开的会。 手机取证 1、分析鸿蒙手机检材&#x…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...

【Redis】笔记|第8节|大厂高并发缓存架构实战与优化

缓存架构 代码结构 代码详情 功能点&#xff1a; 多级缓存&#xff0c;先查本地缓存&#xff0c;再查Redis&#xff0c;最后才查数据库热点数据重建逻辑使用分布式锁&#xff0c;二次查询更新缓存采用读写锁提升性能采用Redis的发布订阅机制通知所有实例更新本地缓存适用读多…...

Mysql8 忘记密码重置,以及问题解决

1.使用免密登录 找到配置MySQL文件&#xff0c;我的文件路径是/etc/mysql/my.cnf&#xff0c;有的人的是/etc/mysql/mysql.cnf 在里最后加入 skip-grant-tables重启MySQL服务 service mysql restartShutting down MySQL… SUCCESS! Starting MySQL… SUCCESS! 重启成功 2.登…...

STM32HAL库USART源代码解析及应用

STM32HAL库USART源代码解析 前言STM32CubeIDE配置串口USART和UART的选择使用模式参数设置GPIO配置DMA配置中断配置硬件流控制使能生成代码解析和使用方法串口初始化__UART_HandleTypeDef结构体浅析HAL库代码实际使用方法使用轮询方式发送使用轮询方式接收使用中断方式发送使用中…...

NPOI Excel用OLE对象的形式插入文件附件以及插入图片

static void Main(string[] args) {XlsWithObjData();Console.WriteLine("输出完成"); }static void XlsWithObjData() {// 创建工作簿和单元格,只有HSSFWorkbook,XSSFWorkbook不可以HSSFWorkbook workbook new HSSFWorkbook();HSSFSheet sheet (HSSFSheet)workboo…...