Vue 自定义局部指令
作者：互联网
局部指令的基本语法：
directives:{
focus:{
//指令的定义
inserted:function(el){
el.focus()
}
}
}在Vue实例中添加directives
具体实现的代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>局部指令</title>
</head>
<body>
<div id="app">
<input type="text" v-color="msg" />
</div>
<script src="vue.js"></script>
<script>
const vm = new Vue({
el: "#app",
data: {
msg: {
color: "red",
},
},
directives: {
color: {
bind: function (el, binding) {
el.style.backgroundColor = binding.value.color;
},
},
},
});
</script>
</body>
</html>局部指令只在所定义的组件中使用。
标签：el,Vue,自定义,color,局部,指令,directives 来源： https://blog.csdn.net/Seric_xiao/article/details/120442085