与风一起
2019-05-20 19:52
采纳率: 0%
浏览 689

vue 实现监控textarea中英文单词的数量并在超出20个单词后使数字变红

word counter:后面是单词的数量,并在20个单词以后改数字变红

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • 单词?不是限制字符吗?如果你单词输入一个后,空格,然后在输入,那么就直接分割他,然后判断数组的长度,大于20就做变红操作。

    评论
    解决 无用
    打赏 举报
  • flttxq 2019-05-21 09:34

    楼上回答的是jquery的写法,用vue可以给textarea绑定一个变量,监听它的输入事件,根据变量的长度显示颜色。

    <textarea v-model="value" v-bind:style="{color: value.length>20?'red':''}" v-on:input="inputValue"></textarea>
    

    让数字变红同理。

    inputValue(){
                if(this.value > 30){
                    this.value = this.value.substring(30, this.value.length-30);
                }
            }
    

    限制输入长度的方法

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题