vue中文本域限制字数的方法

用watch来监听,实现操作也比较简单

HTML

<textarea  v-model="title" ></textarea>
<span>{{ title.length }}/200</span>

JS

<script>
export default {
  name: 'XXX',
    data() {
        return {
            title: '',
            titleMaxLength:200
        };
    },
    methods:{
    },
    watch: {
        // 文本域字数限制
        title() {
            if (this.title.length > this.titleMaxLength) {
                this.title = String(this.title).slice(0, this.titleMaxLength);
            }
        }
    }
}
</script>

CSS

textarea{
     width: 100%;
     height: 60px;
     border: none;
     outline: none;
     box-sizing: border-box;
}