uniapp 富文本框 获取输入字符长度

uniapp 富文本框 获取输入字符长度

原理很简单,只要通过 textarea 的 @input 事件 就能拿到 所有的参数

uniapp 富文本框 获取输入字符长度
图中所示 是输入字符长度
可通过 console.log( e.detail.cursor) 打印


<template>
	<view class="content">
		<view class="describe">
			<view class="describe_kuang">
				<textarea maxlength="1000" @input="getlenth" placeholder="温馨提示:您可将职位描述通过微信、QQ传送到手机上,再复制粘贴到此处,谢谢。" />
			</view>
			<view class="describe_text"><text>{{length}}</text>/<label>1000</label></view>
		</view>
		<view class="preservation">
			<label class="preservation-bot">保存</label>
		</view>
	</view>
</template>
<script>
 export default {
   data(){
     return {
		 length:0
	}
	   },
    onl oad(){
     },
    methods: {
		getlenth(e){
			this.length = e.detail.cursor;
		}
     }
 }
</script>
<style>
	.describe{ width: 94%; height: auto; margin: 25upx auto; background: #fff; border-radius: 10px; box-sizing: border-box; padding: 30upx 3%; box-shadow: 0px 3px 13px rgba(0,0,0,0.02);  }
	.describe_kuang{ width: 100%; height: 450upx; margin-bottom: 25upx; }
	.describe_kuang textarea{ width: 100%; height: 450upx; font-size: 15px; line-height: 45upx; }
	.describe_text{ width: 100%; height: auto; display: flex; flex-direction: row; justify-content: flex-end; font-size: 15px; color: #686868;  }
	.describe_text text{ color: #2ebbfe; }
</style>





上一篇:springboot读取配置文件的几种方式


下一篇:React JSX file giving error “Cannot read property 'createElement' of undefined”