码迷,mamicode.com
首页 > 其他好文 > 详细

vue使用textare如何正确统计输入字符个数

时间:2019-10-12 11:08:27      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:des   允许   href   解决   mode   开发   row   字符   form   

最近vue做微信公众号的开发,使用weui的textarea输入限制字数(官网例子),并且显示。代码如下:再安卓和电脑都没有问题,但是ios输入的时候,显示字数不正确,

但是输入之后删除其中一个,就可以正确显示,比较坑的。

<div class="weui-cell__bd">
  <textarea
    v-model="consultation.description"
    id="description"
    class="weui-textarea"
    placeholder="请概要描述您看到的现象,最大允许输入500字"
    rows="12"
    @keyup="textarea(‘#description‘);">
    </textarea>
  <div class="weui-textarea-counter">
    <span>0</span>/
    <i>300</i>
</div>

针对这个问题我查找textarea可以监听的事件,终于发现一个新事件属性oninput完美解决,具体代码如下:

<div class="weui-cell__bd">
  <textarea
    v-model="consultation.description"
    id="description"
    class="weui-textarea"
    placeholder="请概要描述您看到的现象,最大允许输入500字"
    rows="12"
    @input="textarea(‘#description‘);">
    </textarea>
  <div class="weui-textarea-counter">
    <span>0</span>/
    <i>300</i>
</div>

 

vue使用textare如何正确统计输入字符个数

标签:des   允许   href   解决   mode   开发   row   字符   form   

原文地址:https://www.cnblogs.com/dehuachenyunfei/p/11658815.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!