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>
相关推荐
m0_7381207211 分钟前
CTFshow系列——命令执行web53-56
前端·安全·web安全·网络安全·ctfshow
Liu.7742 小时前
uniappx鸿蒙适配
前端
山有木兮木有枝_3 小时前
从代码到创作:探索AI图片生成的神奇世界
前端·coze
ZXT3 小时前
js基础重点复习
javascript
言兴3 小时前
秋招面试---性能优化(良子大胃袋)
前端·javascript·面试
WebInfra5 小时前
Rspack 1.5 发布:十大新特性速览
前端·javascript·github
雾恋5 小时前
我用 trae 写了一个菜谱小程序(灶搭子)
前端·javascript·uni-app
烛阴6 小时前
TypeScript 中的 `&` 运算符:从入门、踩坑到最佳实践
前端·javascript·typescript
Java 码农6 小时前
nodejs koa留言板案例开发
前端·javascript·npm·node.js
ZhuAiQuan7 小时前
[electron]开发环境驱动识别失败
前端·javascript·electron