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>