[wechat applet] text field input with maximum word limit (1/100)

<!--  Input box  -->
<view class="inputBox">
    <textarea class="textarea2" auto-height minlength="{
     {minAddr}}" maxlength="{
     {maxAddr}}" placeholder=" Please enter the mailing address " placeholder-class="phcolor" bindinput="inputeditAddr" data-obj="contentAddr" value="{
     {contentAddr}}">
         <text class="currentWordNumber">{
   {currentWordNumberAddr|0}}/{
   {maxAddr}}</text>
    </textarea>
</view>

        //  Text domain 
        minAddr: 0,
        maxAddr: 100,
        contentAddr: '', // Mailing address 



    // inputeditAddr
    inputeditAddr(e) {
    
        var value = e.detail.value;
        let dataset = e.currentTarget.dataset;
        this.data[dataset.obj] = value;
        var len = parseInt(value.length);
        if (len > this.data.maxAddr) return;

        this.setData({
    
            currentWordNumberAddr: len
        });
        if (this.data.currentWordNumberAddr == 100) {
    
            wx.showModal({
    
                title: ' Tips ',
                content: ' You have entered the maximum number of times ',
            })
        }

    },

/* */
.inputBox {
    
    width: 100%;
    /* height: 76rpx; */
    display: flex;
    box-sizing: border-box;
    /* padding: 0 20rpx; */
    font-size: 28rpx;
    font-family: PingFang SC;
    font-weight: 400;
}

.textarea2 {
    
    width: 100%;
    min-height: 200rpx;
    max-height: 400rpx;
    line-height: 40rpx;
    background-color: #f6f6f6;
    font-size: 32rpx;
    font-family: PingFang SC;
    font-weight: 400;
    /* padding: 20rpx 0; */
    padding: 20rpx;
    box-sizing: border-box;
    /* line-height: 60rpx; */
    color: #2B2B36;
    position: relative;
}

.currentWordNumber {
    
    position: absolute;
    bottom: 24rpx;
    right: 26rpx;
    color: #888;
}