饿了么 <el-input></el-input>输入框获取与失去焦点事件

 

 

 

//1.定义focus事,绑定属性 

<el-input 
    v-model="headerInput" 
    @focus="onInputFocus" 
  
@blur="onInputBlur":style="thisStyle">
</el-input>

thisStyle:'',

//2.获得焦点事件
onInputFocus(){
let self = this;
 self.thisStyle="outline: 0;box-shadow: 0px 0px 10px 0px #ffffff;transition: border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;-moz-transition:border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;-webkit-transition:border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;"
},

//3.失去焦点事件
onInputBlur(){
let self = this;
self.thisStyle = "width: 330px;"
},
 

 

posted @ 2019-11-06 17:18  熊削铁如泥-厚积薄发  阅读(16000)  评论(0编辑  收藏  举报