vue学习笔记-动态绑定（v-bind）

v-bind的基本使用

例如可以动态绑定img标签中的src或者是a标签中的href属性中的值
如下：
分别动态绑定了img标签中的src或者是a标签中的href属性中的值

 <div id="app"> 
                <img v-bind:src="imgsrc">
                <a  :href="ahref">百度一下</a>//常用的简便写法
            </div>
       <script>
           var app = new Vue({
   
               el:'#app',
               data: {
   
                   content:'人的本质悬置在人的自由当中',
                   imgsrc:'1.jpg',
                   ahref:'http://www.baidu.com'
               }
           }) 
       </script>

v-bind动态绑定class

对象语法

用法说明	实例
通过{ }绑定类+变量名	< span :class="{ backgroundC:isbackground}">Hi< /span>
通过{ }绑定类+布尔值	< span :class="{‘fontS’:true}">Hi< /span>
和普通的类同时存在	< span class=“backgroundC” :class="{ ‘fontS’:true}">Hi< /span>
放在methods或者computed中	< span :class=“getClass()”>Hi </ span>

<div id="app"> 
                <!--<h2 :class="{类名:布尔值,类名：布尔值}">当布尔值为true时类名添加到其中</h2>-->
                <span :class="{ backgroundC:false,fontS:true}">{