Vue2.0 条件,列表

条件渲染 (v-if)

1.vue中的v-if 和angular中的ng-if效果是相同的 使用方法基本也是相同的
2.在v-if 中紧跟着v-else 把if的条件改为false 之后会显示v-else所在标签的内容, 这就相当于js中的if-else(如果---否则---),中间也可以填加v-else-if
3.v-show的用法和ng-show的用法也是一样的 不可以后面接v-else

    
        
        
        

    
    
        

            
            
            加油!
            
            
看到了没
  
            

            肯定能看见我

        
    
    
    

列表渲染(v-for)

1.在angular中列表渲染为ng-repeat, vue中就是v-for
2.在vue1.0中存在着$index 和angular一样使用 ,但是在vue2.0中没有了$index 如果要获得下标时 写为'' (val,index) in arr '' 里面的index就代表下标 但是切记不能写成$index
3.遍历对象: v-for="x in obj" ==>{{x}}
(val,key) in obj ==>{{key+"--"+val}}
(val,key,index) in obj ==>{{key+"--"+val+"--"+index}}
遍历对象可以带回来的参数 这样的话 对象也可以用下标了
4.在vue中想遍历一定次数 直接定义次数然后遍历即可 没有了angular的繁琐
5.在vue中有重复的元素时 在vue1.0 中解决办法v-for="a in arr2" track-by="$index" ; 在vue2.0 中写法 v-for="a in arr2" v-bind:key="obj.id" 注:obj.id是遍历对象里面的唯一值,给key绑定上这个唯一值,让vue能正确的找到元素实现更改
上课所写的原码

    
        
        
        

    
    
        

            
            {{x}}
            

            
{{index+"-"+val}}
            

            {{y}}
            
{{key+"--"+val}}
            

            
{{index+"-"+key+"-"+index}}
            

            
            
{{i}}
            

            
            
{{a}}----{{a.name+"-"+a.age}}