Element: [Bug Report] el-input 输入非字母、数字的字符 双向绑定失败

[fei316]

Element UI version

1.2.4

OS/Browsers version

win7 chrome

Vue version

2.2.4

Reproduction Link

https://jsfiddle.net/pj71jkyw/3/

Steps to reproduce

输入框输入字符串：22222@@@@

What is Expected?

过滤掉输入框中的非字母 数字

What is actually happening?

vue中的变量可以修改成功 但是输入框显示没有改变。也就是双向绑定失败了

[pengchongfu]

因为vue的更新视图函数是异步的。同时触发input和change时事件都修改了父组件的data里的值，但是on-change函数在刚输入不合法值的时候会返回data的初始值。
（比如说在输入 11@@@ 时，再输入一个1，on-change函数返回111，与原来的11不一样，因此异步的更新视图函数会执行，子组件的watch也会执行，因此input内变为111）
所以当异步的更新视图函数执行时会发现data没变。因此不会触发子组件的watch函数。

其实这个问题和element关系不大。解决办法有两个

1. 父组件的状态变化改为异步

this.$nextTick(() => {
  this.form.name = str;
})

1. 修改element input组件的代码

this.$nextTick(() => {
  this.$emit('change', value);
})

[baiyaaaaa]

@pengchongfu +1
please change you value in the $nextTick

this.$nextTick(() => {
  this.form.name = str;
})