IView Input禁止输入空格,IView v-model.trim修饰符失效,IView输入框禁止输入空格

Posted 天渺工作室

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了IView Input禁止输入空格,IView v-model.trim修饰符失效,IView输入框禁止输入空格相关的知识,希望对你有一定的参考价值。

Iview 输入框Input组件地址 https://iview.github.io/components/input

IViewUI和elementUI还不一样,vue自带的trim禁止输入空格修饰符竟然在Input 组件中不起作用。

官方也没有自带什么方法 

<!--IView UI里面   trim修饰符还不起作用 坑爹-->
<Input v-model.trim="value" placeholder="请输入..." @input="inputFun" style="width: 300px"></Input>

解决方案

...

methods:{

//封装成自定义指令最好

inputFun(e) {
   //$nextTick必须
   this.$nextTick(() => {
        //正则过滤空格
        this.value = e.replace(/\\s+/g,\'\');
   }) 
}


}


...

以上是关于IView Input禁止输入空格,IView v-model.trim修饰符失效,IView输入框禁止输入空格的主要内容,如果未能解决你的问题,请参考以下文章

iview 动态实现增减输入框

iview input绑定enter事件

iview的table中嵌套input,select等

iview inoput type=textarea 禁止拉伸

iview 怎样屏蔽掉账户框自动显示账户名和密码(root,***)

iview render input每输入一个字符就会自动跳出焦点