1、vue自定义非空指令:
main.js中自定义非空指令
当input框或下拉框中数据更新时,触发校验
Vue.directive('isEmpty',{
update:function(el,binding,vnode){
if(vnode.componentInstance.value==""){
el.classList.add("is-required");
}else if(vnode.componentInstance.value||vnode.componentInstance.value==0){
el.classList.remove("is-required");
}
}
})
2、css 全局添加必填样式:
.is-required input{
border-color:red!important
}
3、具体应用:
<el-select placeholder="请选择" v-isEmpty v-model="form.name"></el-select>
<el-input v-isEmpty v-model="form.age" />
4、寄语:
过去这一年,你最大的收获是什么呢?
不一定要“战绩赫赫”,
不一定要“大有所成”,
捞出属于你的“星星”即可!
拥有那些“不负生活”的闪亮时刻即可!