vue學習(三) v-bind指令

 

//html
<div id="app">
　　<input type="button" value="ok" v-bind:title="msg">
　　<input type="button" value="ok" v-bind:title="msg +'123aaa' ">//也能夠拼接字符串，渲染出來是 點擊一下123aaa
</div>
//script
<script>
　　var vm = new Vue({
　　　　el:'app',
　　　　data:{
　　　　　　msg:'點擊一下'
　　　　}
　　})
</script>

 

說明：v-bind是用來綁定屬性變量的，若是沒有v-bind那麼鼠標放到ok按鈕上的時候，懸浮的標題是「msg」字符串,而不是msg中的內容

只有經過v-bind綁定title屬性的msg變量   title纔會取到msg中的內容，鼠標放上去，懸浮的標題是「點擊一下」

v-bind是能夠省略不寫的，只留冒號 就默認表示使用了v-bind綁定某個屬性變量  v-bind中能夠寫合法的js表達式