Vue之v-bind绑定DOM元素的属性

demo地址:

https://github.com/comeriven/Vue

代码演示:

https://jsfiddle.net/riven952465/bL2aj4po/

作用

用于绑定DOM元素的某个属性,比如image的src属性,class属性,style属性,title属性等,并给这些属性进行赋值。
当绑定 class 或者 style 属性时,值可以是数组或者对象。

缩写

v-bind 在页面中有个很简便的书写方式“:”,可以用一个引号完美代替 v-bind:

egg:

html

<div id="app">
  <!-- v-bind:可缩写为: -->
  <span>这是v-bind绑定DOM元素属性的demo,请使用开发者工具栏中elements项查看本元素的属性</span>
</div>

JavaScript

// 创建Vue实例
var obj = new Vue({
    el:'#app',// 指定元素
    data:{// 指定数据
        message:'这里是title属性的值'+new Date()
    }
})    

更多该指令的信息请参考官网API:
v-bind

发布者

iamorz

前端技术群:263240563

发表评论

电子邮件地址不会被公开。 必填项已用*标注