vue学习第3天，基础知识，条件渲染，列表渲染，事件处理，内联样式

1，条件渲染 有 v-show v-if v-else-if v-else

2，v-if="isActive" 放到元素上 当data中的 isActive 的boolan值是true的时候 会把v-if所在的那个元素渲染出来 如果为false的话 就不会渲染当前元素 而是渲染紧跟在这个元素后面的有v-else 的元素 或者有v-else-if的元素 

3，v-else必须跟在v-if后面 isActive 可以在行内写 可以在计算变量写 可以在方法写 计算复杂的话就用计算属性或者方法

4，v-show 是通过修改元素的display属性来控制元素的显示与隐藏 元素还在don树上面 

5，v-if 是会直接销毁不需要的元素 频繁使用的话 开销比v-show大

6，v-show 在第一次初始化元素的时候 不管显示还是隐藏 都会渲染元素 而v-if有惰性 如果初始的时候是隐藏就不会渲染元素 知道条件为true才会开始渲染元素

7，v-if v-show也可以用在组件模板上 就像在普通元素上使用一样

8，列表渲染有v-for 可以分为数组渲染和对象渲染

9，数组渲染 <li v-for="todo in todos">{{todo.msg}}</li>

10，可以加上索引 <li v-for="(todo,index) in todos">{{index}}+{{todo}}</li> index是todo在todos数组中的索引 todo是数组中的每一个元素

11，对象渲染 <li v-for="value in objects">{{value}}</li> value 是对象中的每一个值

12，可以加一个key <li v-for="(value,key) in object">{{key}}+{{value}}</li> key:value 是对象中的键值对

13，可以再加一个索引 <li v-for="(value,key,index) in object">{{index}}+{{key}}+{{value}}</li> index是键值对在对象中的索引

14，事件处理 v-on:click="doSomething"  可以绑定javascript语句 把参数 click="doSomething" 传给 v-on 当元素被点击的时候 执行methods中的doSomething方法

15，内联样式 v-bind:style="{fontSize:fontSize+"px"}" 属性较多的话就应该直接传一个对象 v-bind:style="object" object在data里面 

 可以传入一个数组   v-bind:style="[style1,style2]"