[TOC]
### **1. v-bind用于給HTML標簽設置屬性**
```
v-bind:html屬性="vue中data屬性"
```
**或簡寫成**
```
:屬性="data屬性"
```
例如:
~~~
<!--<div v-bind:titles='title1'>123</div>-->
<div :titles='title1'>123</div> <!--簡寫形式-->
<script>
new Vue({
el:"#root",
data:{
title1:"v-bind對應的屬性值",
content:"Please enter your name"
}
})
</script>
~~~
## **:符號表示傳的值是變量,不加這個符號表示傳的就是字面量**
所以,也可以直接這樣寫(去掉:)
```
<div titles="v-bind對應的屬性值">123</div>
```
html頁面渲染如下

### **2. 字符串拼接**
```
<span :text=' "we" + 1 '>使用</span>
```
會渲染成:
```
<span text='we1'>使用</span>
```
所以,要想在v-bind指令中使用字符串拼接,只需要結合引號即可。
### **3. 運算**
```
<div :text='1 + 2'>test</div>
```
渲染成:
```
<div text="3">test</div>
```
1
### **4. 調用vue函數**
```
<div :text='getText()'>test</div>
```
~~~
methods:{
getText: function() {
return "functions"
}
}
~~~
渲染成
```
<div text="functions">test</div>
```
- vue
- 為什么要學vue
- 數據雙向綁定
- vue指令
- v-bind創建HTML節點屬性
- v-on綁定事件
- v-cloak
- v-text
- v-for和key屬性
- v-if和v-show
- 案例1
- 自定義指令
- vue樣式
- vue生命周期
- vue過濾器
- 自定義鍵盤修飾符
- 跨域請求
- vue組件
- 組件基礎
- 引入vue文件組件
- 引入render函數作為組件
- 兄弟間組件通信
- 組件函數數據傳遞練習
- 路由
- 數據監聽
- webpack
- vue校驗
- vue筆記
- form表單中input前部分默認輸入,切不可修改
- mixins
- 部署到nginx
- scope
- render
- 下載文件
- vue動態組件
- axios
- Promise
- vue進階
- node-vue-webpack搭建
- vue事件
- 插槽
- vuex
- vuex基礎
- vuex命名空間
- HTML遞歸?
- this.$nextTick異步更新dom
- elementui
- table
- 修改element ui樣式
- form
- 優質博客
- vuex state數據與form元素綁定
- es6
- Promise