Vue.js教程（二）：v-bind动态属性

上一节我们学习了Vue的基本语法，里面有个占位变量{{message}}。这种{{message}}形式的vue变量只适合给标签中的文本复制（开始标签和结束标签中间的文字）。v-bind是给属性设置变量的。

简介

v-bind是给属性设置变量的。属性和文本的含义如下：

hello Vue

如上，title是属性，hello Vue是文本。Vue操作文本可以如下写法：

{{text}}

但是操作title属性使用双大括号就是错误的，比如如下就是错误的：

{{text}}

如上属性title中使用{{title}}格式占位是无效的。
属性中的占位变量需要使用v-bind操作。

v-bind使用

v-bind作用于标签的属性上，用户绑定属性变量（动态属性）。比如要将title属性通过vue动态赋值，操作步骤和语法如下：

    
    
    
    




  
    鼠标悬停几秒钟查看此处动态绑定的提示信息！
  

以上代码，除了v-bind之外的其他Vue语法在上一节已经讲过。

学习前端最好的方式就是动手用一用，效果出来了就明白了。