700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 微信小程序textArea组件字数限制

微信小程序textArea组件字数限制

时间:2020-01-13 04:28:02

相关推荐

微信小程序textArea组件字数限制

在写小程序的过程之前,我们经常能遇到输入区域的字数限制问题,今天就来看一下如何限制textArea的字数

实现效果

wxml

<view class="xinxi"><textarea placeholder='请提供详细的设备故障信息' minlength="{{min}}" maxlength="{{max}}" bindinput="inputs"><text class="currentWordNumber">{{currentWordNumber|0}}/{{max}}</text></textarea></view>

js

Page({data: {min: 0,max: 20,},inputs: function (e) {var value = e.detail.value;var len = parseInt(value.length);if (len > this.data.max) return;this.setData({currentWordNumber: len});if(this.data.currentWordNumber == 20){wx.showModal({title: '提示',content: '您输入的次数已达上限',})}}})

wxss

.xinxi {width: 690rpx;height: 360rpx;border-radius: 8rpx;margin: 28rpx auto;border: 2rpx solid #e5e5e5;box-sizing: border-box;position: relative;}.xinxi >textarea {width: 638rpx;height: 360rpx;padding: 26rpx 26rpx 0rpx 26rpx;}.currentWordNumber {position: absolute;bottom: 40rpx;right: 26rpx;color: #888;}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。