【微信小程序】文本域输入带最大字数限制（1/100）

<!-- 输入框 -->
<view class="inputBox"><textarea class="textarea2" auto-height minlength="{{minAddr}}" maxlength="{{maxAddr}}" placeholder="请输入邮寄地址" placeholder-class="phcolor" bindinput="inputeditAddr" data-obj="contentAddr" value="{{contentAddr}}"><text class="currentWordNumber">{{currentWordNumberAddr|0}}/{{maxAddr}}</text></textarea>
</view>

// 文本域minAddr: 0,maxAddr: 100,contentAddr: '', //邮寄地址// inputeditAddrinputeditAddr(e) {var value = e.detail.value;let dataset = e.currentTarget.dataset;this.data[dataset.obj] = value;var len = parseInt(value.length);if (len > this.data.maxAddr) return;this.setData({currentWordNumberAddr: len});if (this.data.currentWordNumberAddr == 100) {wx.showModal({title: '提示',content: '您输入的次数已达上限',})}},

/*  */
.inputBox {width: 100%;/* height: 76rpx; */display: flex;box-sizing: border-box;/* padding: 0 20rpx; */font-size: 28rpx;font-family: PingFang SC;font-weight: 400;
}.textarea2 {width: 100%;min-height: 200rpx;max-height: 400rpx;line-height: 40rpx;background-color: #f6f6f6;font-size: 32rpx;font-family: PingFang SC;font-weight: 400;/* padding: 20rpx 0; */padding: 20rpx;box-sizing: border-box;/* line-height: 60rpx; */color: #2B2B36;position: relative;
}.currentWordNumber {position: absolute;bottom: 24rpx;right: 26rpx;color: #888;
}

【微信小程序】文本域输入带最大字数限制（1/100）相关推荐

微信小程序---文本域输入带最大字数限制
效果代码 js Page({/*** 页面的初始数据*/data: {min: 0,max: 100,explain: '', //说明password: ''},/*** 生命周期函数--监听页面 ...
微信小程序跨域问题 post 403 Invalid CORS request 后台
微信小程序跨域问题 post 403 Invalid CORS request 后台
微信小程序文本查看更多和收起
微信小程序文本查看更多和收起微信小程序中,有时候文本需要实现这样的功能: 1.文本超过n行显示省略号 2.省略时,显示展开/收起按钮 3.文本不超过n行时,不显示省略号和展开/收起按钮实现功能 ...
微信小程序-文本与图片无法对齐
最近项目开发小程序,于是打算重新做一遍七月老师的小程序入门项目,熟悉一下,但是做到阅读页面时却突然遇到了一个问题:文本与图片怎么都无法对齐,真的是对着代码研究了一个多小时才突然想到了原因,想想也许有人 ...
微信小程序文本输入＜textarea/＞详解
也许你迷茫,但是我想说,在你迷茫的同时,保持本心,过好今天就好. 在微信小程序开发中,input 用来实现文本输入,是单行的,textarea是多行的输入实现 1 基本使用 <textarea ...
微信小程序文本超出自动换行解决方案
使用场景:在一段文本中,显示的内容过多,超出原本设置的范围,现在需要将它进行分行显示. 实现方案: 前提:给 view或者 text 容器设置默认的 display: block 然后设置属性:tex ...
微信小程序文本、图片内容违规信息校验
首先放微信官方文档介绍:微信官方违规内容校验.翻到下面的健康运营指引>>内容安全解决方案,里面有包含文字内容.图片等信息校验,通过调用微信官方接口审核,保证了运营内容的绿色健康. 强调说 ...
taro+vue微信小程序文本换行
文本换行在微信小程序中 br是不管用的无法识别解决方法:使用 \n 例子: <view>文本换行<text>{{ br }}</text>文本换行文本换行文本换 ...
微信小程序 - 跨域问题
微信小程序的复杂请求是通过微信后台服务器请求的,也就是说请求来源的origin域是微信后台服务器,为了解决跨域问题得自己的后台允许微信服务器的域:servicewechat
微信小程序文本组件text使用详解-微信小程序系统学习攻略
也许你迷茫,但是我想说,在你迷茫的同时,保持本心,过好今天就好. 在微信小程序中,组件 text 用来显示文本,基本使用代码如下: <text >测试使用</text> 1 基 ...

【微信小程序】文本域输入带最大字数限制（1/100）

【微信小程序】文本域输入带最大字数限制（1/100）相关推荐

最新文章

热门文章