今天,在看别人的写的七牛组件时,看到如下这种写法:
<div :id="pickfiles" class="btn">点击上传图片</div>
对于 :id="pickfiles", 这种写法一下懵逼了没明白过来,我看过更多的写法是例如 :class="class1", :src=" " :title=" ", 后来到官方文档看了一下,发现其实它们代表的都是一个意思,属性的动态绑定,都是v-bind 的一种简写。
:id="pickfiles”,不是元素的id就是pickfiles,而pickfiles只是一个变量,它的存在必须在实例的data中去声明一下,如果在data对象中没有给pickfiles赋值,则在页面渲染时id是没有值的,下面我展示一下,当在data中给赋值与没有赋值的两张表现形式:
PS:从上面的显示的情况,可以看出 :id 后面的值仅仅只是一个变量,而不是真正的id名字,这是我今天对于v-vind指令的一点理解,做个笔记记录一下,希望能让自己更清晰的去认识Vuejs。