uniapp 输入框文本域（uni-easyinput）内容长度限制

最新推荐文章于 2024-03-23 09:21:11 发布
最新推荐文章于 2024-03-23 09:21:11 发布
阅读量2.8k 收藏
点赞数
分类专栏： 前端学习笔记——uni-app篇 文章标签： uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44776454/article/details/131654081
版权

问题描述

提示：uni-ui 组件库中 uni-easyinput 输入框组件 相关使用问题

在使用 uni-easyinput 组件时，你会发现，默认情况下你输入内容的长度最大是140

原因是，uni-easyinput 组件内封装的 maxlength属性，在不设置的情况下，默认值为140。
我们可以通过 maxlength属性，为使用的输入框 限制其长度。当然也有无限制的情况。无限制输入长度的情况，注意并不是 不设置maxlength属性，而是将maxlength属性值 置为 -1。
在这里插入图片描述

前端白袍
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
uniapp代码组件的总结
qq_36981190的博客
04-14 5671
这里写目录标题内置组件 内置组件 view 视图容器 属性说明 1、hover - class 指定按下去的样式类，与class类似，当hover-class = “none”时，没有点击状态 效果。 2、hover-stop-propagation 默认值false，指定是否阻止本节点的祖先节点出现点击状态。当给父子级都设置了hover-class,你会发现竟然还是冒泡的，为阻止冒泡，就需要用到hover-stop-propagation属性 3、hover-start-time 按住后多久出现点击状态
JavaScript实现点击单选按钮改变输入框中文本域内容的方法
10-23
主要介绍了JavaScript实现点击单选按钮改变输入框中文本域内容的方法,涉及javascript单选按钮控制页面元素样式的相关技巧,非常简单实用,需要的朋友可以参考下
如何在uniapp框架中自己的页面中修改uni-easyinput或其它的扩展组件的宽高。
qq_52879298的博客
11-18 1450
高的话，先在组件源码中找到控制当前组件显示宽高的样式类名，然后在自己当前页面设置其演示即可，注意使用/deep/,比如uni-easyinput组件里控制显示的样式是uni-easyinput__content-input。哈哈哈宽简单，可以给这个组件外面套一层view，给view设置宽去挤压uni-easyinput的宽度。我页面上的组件宽高就生效了。目前我是在微信开发工具上测的，希望能帮到你。
​CC-EasyCommonInput： 基于uni-app原生input组件封装的增强实用输入框组件
最新发布
chenchuang0128的博客
03-23 599
在前端开发中，输入框（Input）是一个常见的UI组件，用于获取用户输入的数据。然而，为了满足不同的业务需求和用户体验，开发人员需要频繁地定制和修改输入框的外观和功能。CC-EasyCommonInput是一个基于uni-app原生Input组件封装的增强通用输入框，它提供了丰富的定制选项和验证规则，使得前端开发人员可以快速构建出满足业务需求的高质量输入框组件。本文将详细介绍CC-EasyCommonInput的使用方法和特性，以及它在前端开发中的优势和应用场景。
uniapp中文本框只能为输入数字和输入值的大小范围
babyxuqian的博客
01-24 7598
<template> <view> <input type="text" placeholder="请输入款号" placeholder-style='color:#808080' v-model="cargoNo" @input='inputClick'> </view> </template> <script> export default { data() { return { cargoNo: .
解决uniapp微信小程序，input框设置了maxlength时，ios在输入时拼音达到了最大长度导致无法继续输入问题
qq_75069372的博客
01-22 736
解决uniapp微信小程序，input框设置了maxlength时，ios在输入时拼音达到了最大长度导致无法继续输入问题
【uni-app】input框限制小数点/整数位数
热门推荐
09-12 1万+
1.适用于uni-app小程序，可简单改造成源生小程序版 2.限制整数位只能为0-99之间的数字 3.最多两位小数 4.首位为小数点时，变成0. 5.只能输入一个小数点 if (e.detail.value.indexOf(".") < 0 && e.detail.value != "") { if(e.detail.value.length>2){ ...
js实现input输入的数字只能大于等于1 （适用于uniapp小程序）
qq_44984407的博客
07-28 3965
最近写了个小程序有个input输入框要求只能输入大于1 的数字 <template> <input class="inputPrice" :maxlength="maxLength" type="digit" v-model="currentPrice" @input="checkPrice"> </template> <script> export default { data() { return { maxLength: 5,
uni-app数字输入框组件
Dwayne_dw的博客
12-29 4214
【代码】uni-app数字输入框组件。
【uniapp 单个文字输入框（方格单字输入）】
qq_31629679的博客
06-30 1561
「类似作文稿单字输入，类似密码输入框，可输入文字」focusClick()方法用于聚焦。focusClick()方法用于聚焦。在输入框上面添加单个字输入UI。
【uni-app】input框输入限制
i_kun的博客
03-28 4473
给input加input事件 <input type="number" v-model="number" @input="numberFixedDigit" /> 然后对input事件进行限制 numberFixedDigit (e) { // 固定两位小数 e.target.value = (e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]) || '' this.$nextTick(() => { this.nu.
uni-app下拉框实现
12-18
uni-app下拉框实现，纯原生写法
vue element-ui实现input输入框金额数字添加千分位
10-15
主要介绍了vue element-ui实现input输入框金额数字添加千分位,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
通过disabled和readonly将input设置为只读效果
12-14
有两种方式可以实现input的只读效果：disabled 和 readonly。 自然两种出来的效果都是只能读取不能编辑，可是两者有很大不同。 Disabled说明该input无效，及其value不会传递给任何程序，比如asp、php等。 Readonly仅仅是无法编辑，不影响其值的传递。 Disabled使用：<INPUT type="text" name="username" value="james" disabled> Readonly使用：<INPUT type="text" name="partNumber" value="1500" readonly>
前端uniapp表情插件
05-09
前端uniapp表情插件
html设置虚线边框的方法
12-14
用到CSS样式和HTML标签元素 为了对html不同标签加边框虚线，我们选择几个常用标签对齐设置边框虚线效果。 1、html常用标签 p标签 span ul li table tr td 2、实例用到CSS属性单词 border width height 3、实现虚线的CSS重点介绍 border为边框属性，如果要实现对象边框效果，要设置边框宽度、边框颜色、边框样式（实线还是虚线） border:1px dashed #F00 这个就是设置边框样式宽度为1px，虚线，虚线为红色。 4、实例描述 我们对以上几个标签设置相同宽度、相同高度、边框效果。 5、完整HTML代码： &lt;!DOCTYPE h
uniapp车牌输入 uni-plate-input-master_uniapp_uniapp车牌号_uniapp车牌输入_un
10-04
uniapp中使用的车牌输入控件，弹出键盘点选
输入框 文本域 字数限制
03-09
自己做的文本框字数统计/限制插件 输入框 或者 文本域 动态显示还剩余可输入字数
修改输入框placeholder文字默认颜色-webkit-input-placeholder方法
12-13
html5为input添加了原生的占位符属性placeholder，高级浏览器都支持这个属性，例如： <input type="text" placeholder="搜索" value=" "> 默认的placeholder字体颜色是呈浅灰色，如果... input:-ms-input-placeho
uniapp-uni-easyinput 放入% 图标
06-07
如果你想在 uniapp-uni-easyinput 中添加“%”符号的图标，你可以使用 Unicode 编码来添加一个百分号的字符，并在输入框中使用该字符作为图标。在 HTML 中，可以使用 `%` 来表示百分号的 Unicode 编码，因此你可以尝试在输入框中添加以下代码： ```html <uni-input placeholder="请输入百分比"> <template #right> % </template> </uni-input> ``` 这将在输入框的右侧添加一个百分号的字符作为图标。你可以根据需要调整样式和位置。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值