vue3+ElInput无法输入的问题

开篇

写业务的时候发现,因为想偷懒嘛,直接就在想在外部去定义一个变量,然后写个弹窗里(tsx)的el-input,而不是又去写个vue页面,但发现就输入不了了,而且跟着文档写textarea没有字数统计。就两个问题嘛

1.el-input无法输入

TSX的写法嘛,最开始我是这么写的

const auditText = ref('');// 忽略代码<ElInputmodel-value={auditText.value}autosize={{ minRows: 5, maxRows: 10 }}max-length={50}placeholder="请填写审核不通过原因(最少五个字)"show-word-limittype="textarea"/>​

然后发现真是一点反应没有啊,然后看了下文档上面的这句话

const auditText = ref<string>('');
function test(value) {console.log(value);auditText.value = value;
}
//忽略代码
<ElInputmodel-value={auditText.value}onInput={test}autosize={{ minRows: 5, maxRows: 10 }}max-length={50}placeholder="请填写审核不通过原因(最少五个字)"show-word-limittype="textarea"
/>
​

但是那其实也不用这么麻烦人文档里也写得很清楚了v-model就行

<ElInputv-model={auditText.value}autosize={{ minRows: 5, maxRows: 10 }}max-length={50}placeholder="请填写审核不通过原因(最少五个字)"show-word-limittype="textarea"
/>
​

2.字数统计不见了

先看看官网的写法,定义个maxlength再定义个show-word-limit就有字数统计了

可是如果我在tsx里按官网这么写会发生什么那

果然吗,不是props的属性就不用写了,原生事件是直接绑定在attrs上给input标签的,所以写在tsx里会报错,写在模版里不会。暂时就忽略这一行检查把~~~。

总结

平时会记录一些简单但好玩的问题,水一篇vue,每天一篇vue一篇react。

关于我的一些介绍

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

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

相关文章

SQL Server:如何检测和修复 FILESTREAM 数据库损坏?

SQL Server 中的 FILESTREAM 功能可以将二进制大型对象 &#xff08;BLOB&#xff09; 存储到文件系统上&#xff0c;而不是将它们存储在数据库中。但是&#xff0c;默认情况下不启用此功能。用户需要使用 SQL Server Management Studio &#xff08;SSMS&#xff09; 和 SQL S…

FORCE 开发者论坛 | 火山引擎发布多款 Agent 开发工具

资料来源&#xff1a;火山引擎-开发者社区 6 月 12 日&#xff0c;2025 火山引擎 FORCE 原动力大会开发者论坛成功举办。大会聚焦 Agent 开发新范式&#xff0c;升级发布了 PromptPilot、MCP Servers、TRAE、扣子开发平台等产品&#xff0c;以及多款开源项目&#xff0c;构建起…

【Qt-windows】如何使用perfmon 具体分析windows serverR2的Qt程序CPU问题

可以使用 Windows 自带的 PerfMon&#xff08;Performance Monitor&#xff09; 工具对运行在 Windows Server R2 上的 Qt 程序进行详细的性能分析&#xff0c;尤其是 CPU 使用情况。以下是具体的操作步骤和建议&#xff1a; 一、打开 PerfMon 工具 按下 Win R 打开运行窗口。…

【软考高级系统架构论文】论NoSQL数据库技术及其应用

论文真题 随着互联网web2.0网站的兴起,传统关系数据库在应对web2.0 网站,特别是超大规模和高并发的web2.0纯动态 SNS 网站上已经显得力不从心,暴露了很多难以克服的问题,而非关系型的数据库则由于其本身的特点得到了非常迅速的发展。 NoSQL(Not only SQL )的产生就是为了解…

bash的配置文件,source

一.按生效范围分类 二.按shell登录的方式分类 这里的执行顺序存疑,因为会互相调用,不需要记忆 source执行脚本 source不创建子进程,bash创建子进程 普通脚本:用bash 配置文件脚本:用source 三.按功能分类

30道C语言高频题整理(附答案背诵版)

1.请描述一下C语言的基本数据类型有哪些&#xff1f; C语言提供了一系列的基本数据类型&#xff0c;它们是构建更复杂数据结构的基础。这些基本数据类型主要包括&#xff1a; 整型&#xff08;Integer Types&#xff09;&#xff1a;用于存储整数值。根据存储大小和符号性&…

使用Tailwind CSS和i18n的react实践

首先在 src 下设置 i18n.js 文件 // src/i18n.js import i18n from i18next; import { initReactI18next } from react-i18next;import en from ./locales/en/public; import zh from ./locales/zh/public;i18n.use(initReactI18next) .init({resources: {en: { translation:…

生信自学路线|R语言的数据变量类型与对应运算

R 是一种动态类型语言&#xff0c;使用灵活&#xff0c;变量无需预先声明类型。掌握 R 的数据类型和变量机制&#xff0c;是后续进行数据处理和建模分析的基础。本章节主要介绍 R 语言中的常量、变量、基本数据类型及常用数据结构&#xff0c;并结合示例进行说明。 文章目录 一…

UI前端大数据处理优化策略:提升数据处理速度与准确性

hello宝子们...我们是艾斯视觉擅长ui设计、前端开发、数字孪生、大数据、三维建模、三维动画10年经验!希望我的分享能帮助到您!如需帮助可以评论关注私信我们一起探讨!致敬感谢感恩! 在数字化浪潮下&#xff0c;前端面临的数据规模正呈指数级增长 ——IDC 预测&#xff0c;2025…

技术调研:时序数据库(二)

除了 InfluxDB、TDengine 和 TimescaleDB&#xff0c;还有其他多个主流的开源时序数据库&#xff0c;各自针对不同场景优化。以下是补充的时序数据库选型清单&#xff0c;涵盖其核心特性、适用场景及局限性&#xff1a; 1. 监控与运维场景 (1) Prometheus 核心优势&#xff1…

【C++/C】十进制数转为十六进制时,如何区分正负? 负数补码高位是1,那么一个很大的正数,高位也会出现1,会和负数搞混吗?

文章目录 1 十进制数转为十六进制时&#xff0c;如何区分正负&#xff1f;1.1 正数处理1.2 负数处理‌1.3 关键点‌ 2 负数补码高位是1&#xff0c;那么一个很大的正数&#xff0c;高位也会出现1&#xff0c;会和负数搞混吗&#xff1f;2.1 符号位明确区分‌2.2 补码的数值范围…

Elasticsearch 如果保证读写一致

Elasticsearch 通过多机制组合保障读写一致性&#xff0c;针对高并发场景优化设计&#xff0c;具体实现如下&#xff1a; 一、写入一致性控制‌ ‌1.1 一致性级别参数&#xff08;consistency&#xff09;‌ 写操作时指定分片确认数量&#xff0c;确保数据可靠同步&am…

内嵌lua解释器 作为组件命令调试

给不同的组件传递不通的参数 好处就是调试代码 只在 lua 代码出现&#xff0c;同时为设备初始化 增加了外部脚本配置的功能接口

Excel工具箱WPS版 增强插件 文本处理、批量录入 数据对比 高级排序

各位Excel办公达人们&#xff0c;今天咱来聊聊方方格子Excel工具箱V3.6.6.0&#xff08;WPS版&#xff09;&#xff01;这玩意儿啊&#xff0c;就是专门给WPS Office用户量身打造的Excel增强插件。它集成了上百项实用功能&#xff0c;能帮咱高效处理数据、优化表格操作&#xf…

创建AWS Bedrock知识库及填坑指南

前言 作者之前的关于Dify实践RAG系统的文章&#xff1a;用它搭建AI Agent原来这么简单&#xff01;-CSDN博客&#xff0c;文末留了TODO&#xff1a; “后面会对此RAG系统进行扩展和增强&#xff1a; 1&#xff09;知识库同步自Web站点 2&#xff09;链接外部知识库 3&…

Swift 变量

Swift 变量 在 Swift 编程语言中,变量是存储数据的基本方式。它们用于在程序的运行过程中保存和修改数据。理解 Swift 中的变量类型和用法对于编写高效、可维护的代码至关重要。 变量的定义 变量在 Swift 中是通过关键字 var 来定义的。定义变量时,需要指定变量存储的数据…

板凳-------Mysql cookbook学习 (十--9)

8.15 基于日期的摘要 Monday, June 23, 2025 mysql> use cookbook Database changed mysql> select trav_date,-> count(*) as number of drivers, sum(miles) as miles logged-> from driver_log group by trav_date; -----------------------------------------…

redis的scan使用详解,结合spring使用详解

Redis的SCAN命令是一种非阻塞的迭代器&#xff0c;用于逐步遍历数据库中的键&#xff0c;特别适合处理大数据库。下面详细介绍其使用方法及在Spring框架中的集成方式。 SCAN命令基础 SCAN命令的基本语法&#xff1a; SCAN cursor [MATCH pattern] [COUNT count]cursor&#…

Go 语言并发模式实践

在 Go 语言并发编程中&#xff0c;合理的并发模式能显著提升程序的可维护性和性能。本文将深入解析三种典型的并发模式实现&#xff0c;通过具体案例展示如何优雅地管理任务生命周期、资源池和工作 goroutine 池。 一、runner 模式&#xff1a;任务生命周期管理 在定时任务、…

【Java 开发日记】你会不会使用 SpringBoot 整合 Flowable 快速实现工作流呢?

目录 1、流程引擎介绍 2、创建项目 3、画流程图 4、开发接口 4.1 Java 类梳理 ProcessDefinition ProcessInstance Activity Execution Task 4.2 查看流程图 4.3 开启一个流程 4.4 将请求提交给组长 4.5 组长审批 4.6 经理审批 4.7 拒绝流程 1、流程引擎介绍 …