Hungry yet <el-input> </ el-input> input box and get lost focus event

 

 

 

// 1 Definitions focus things, binding properties 

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

thisStyle: '', 

. // 2 gets the focus event

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. lost focus event

onInputBlur(){
  let self = this;
  self.thisStyle = "width: 330px;"

},