利⽤vue⾃定义指令实现输⼊框聚焦改变⽗元素的样式需求：
HTML 部分：
<div class="login_input login_Code">
<span class="input_icon">
<i class="icon_all captcha_icon"></i>
</span>
<input
autofocus
type="text"
class="user login_Code_input"
input绑定onblur事件
@input="changeCodeInput"
@="submit"
placeholder="请输⼊验证码"
v-code
/>
<img :src="imgSrc"class="imageCode" title="看不清？换⼀个" @click="changeCodeImage">
</div>
⾃定义指令部分：
export default {
directives: {
// 验证码输⼊框获取焦点以及失去焦点时value值得变化以及⽗元素样式的变化
'code': {
inserted: function (el) {
var parent = el.parentNode
parent.className = 'login_input login_input_focus'
}
parent.className = 'login_input '
}
}
}
}
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。