乐趣区

关于vue.js:input-change-blur-区别

总结下 el-input 中事件 @input 与 @change 的不同:@input 是当值输出时就触发; 而 @change 是当值变动且失去焦点时触发通 @blur, 只是回调的参数不一样
看代码

<el-input
                  id="testId"
                  v-model="test.testId"
                  @input="handleInput"
                  @blur="handleBlur"
                  @change="handleChange" 
                  >
               </el-input>
 handleBlur(event){console.log("blur=", event.target.id)
      console.log("blur value=", this.test[event.target.id])
    },
    handleInput(val){console.log("input=", val)
    },

    handleChange(val){console.log("change=", val)
    },

后果

input= a
input= ab
input= abc
change= abc
blur= testId
blur value= abc
退出移动版