v-bind是为html元素绑定属性
缩写:
html的元素可以有原生属性和自定义属性,每个dom元素的原生属性可以自己上网查找
v-bind的三个修饰符的作用:
在下面的代码中,使用了ref声明了dom元素的名称,id为该div元素的原生属性,data是使用了v-bind简写的方式,在divDom上声明了data的自定义属性
运行结果为:
可以看到在钩子函数中打印出的结果为undefined,自定义属性是无法在钩子函数中使用的
当我们添加了prop修饰符后,运行结果为:
控制台成功打印了自定义的data属性的值
prop修饰符的作用:自定义属性转为原生属性
在下面的代码中,打印了divDom元素
控制台输出为:
在divDom的attributes属性中展示了该dom元素的所有属性,
所以, 当我们追加我们的data自定义属性的修饰符attr,并添加我们在钩子函数中写成attributes中的data时,
控制台输出为:
可以成功打印出data的值
.camel修饰符:- 将短横线命名的 attribute 转变为驼峰式命名。不做举例说明
v-bind还可以用来组件之间的传值,后续组件学习再记录
标签:元素,自定义,bind,修饰符,使用,data,属性 From: https://www.cnblogs.com/123-hh/p/18133931