vue项目中element-UI上使用原生事件不生效问题(用native修饰符解决)

    用第三方组件或者UI框架会自带自身封装的事件,如keyup等,会覆盖原生的组件而无法起效果

      而  .native 修饰符就是用来注册元素的原生事件而不是组件自定义事件的

如下:

<el-input v-model="QueryText" placeholder="请输入内容" id="myInput" v-on:keyup.exact.enter="sayMyname()"></el-input>

  在上面这段代码中,我们的键盘抬起事件无法生效,需要添加.navtive修饰符方可生效

<el-input v-model="QueryText" placeholder="请输入内容" id="myInput" v-on:keyup.native.exact.enter="sayMyname()"></el-input>

  此时的keyup事件便可以正常触发.所以以后我们在使用插件时一定要注意事件是否触发,找不到原因就可能是原生事件被封装的事件覆盖的情况

posted @ 2022-10-30 14:53  Ynline  阅读(139)  评论(0)    收藏  举报