uniapp里textarea多行文本输入限制数量

uniapp里textarea多行文本域实现输入计数

javascript 复制代码
<template>
	<view class="inputs">
		<textarea class="text1" maxlength=50 placeholder='请输入...' @input="sumfontnum"></textarea>
		<text class="text2">{{fontNum}}/50</text>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				fontNum:0
			}
		},
		methods: {
			// 限制文本框字数
			sumfontnum(e) {
				console.log(e)
				this.fontNum = e.detail.value.length
			}
		}
	}
</script>
 
<style scoped>
	.inputs{
	   height: 170rpx;
	   border: 2rpx solid #EAEAEA;
	   border-radius: 10rpx;
		 padding-top: 34rpx;
		 padding-left: 35rpx;
		 padding-right: 35rpx;
	}
	.text1{
		width: 100%;
	   color: #000000;
		 height: 130rpx;
	   font-size: 26rpx;
	  
	}
	.text2{
		height: 40rpx;
		line-height: 40rpx;
	   color: #000000;
	   font-size: 20rpx;
	   float: right;
	   margin-top: -10rpx;
	}
</style>
相关推荐
哟哟耶耶几秒前
component-编辑数据页面(操作按钮-编辑,保存,取消) Object.assign浅拷贝复制
前端·javascript·vue.js
bjzhang753 分钟前
使用 HTML + JavaScript 实现可编辑表格
前端·javascript·html
GDAL5 分钟前
js的markdown js库对比分析
javascript·markdown
指尖跳动的光5 分钟前
js如何判空?
前端·javascript
石像鬼₧魂石14 分钟前
Fail2ban + Nginx/Apache 防 Web 暴力破解配置清单
前端·nginx·apache
梦65014 分钟前
基于Umi 框架(Ant Design Pro 底层框架)的动态路由权限控制实现方案
前端·react
weixin_464307631 小时前
设置程序自启动
前端
小满zs1 小时前
Next.js第十七章(Script脚本)
前端·next.js
小满zs2 小时前
Next.js第十六章(font字体)
前端·next.js