Vue.js 笔记

v-bind：绑定属性

v-bind绑定属性，v-bind:属性名=‘值’，v-bind :属性名=‘值’

v-model 双向数据绑定

        
        
{{msg}}
    
  

我们把msg绑定到input元素上，同时p标签里也要现实msg.打开页面我们发现当向input中输入内容时，p标签中的值会随着input中的内容变化，这就是一个最简单的双向数据绑定

v-for:对数组或对象进行循环操作

        

            
{{val}}
        
    
  

v-on:事件绑定

       点击
   
    
    

v-show/v-if

控制元素的显示或隐藏 display:none
&& 与
|| 或
// 有假与为假，有真或为真
！ 非 取反

    
    
    


    

        切换
        

    
    
    

v-show/v-if都可以控制元素的显示和隐藏，但是方式不一样，v-show使用的是display:none来控制的，v-if使用的是visibility:hidden来控制的

display：none 不显示
visibility：hidden 隐藏可见性
不显示就是啥都没有，隐藏可见性有可能是文字或图像与背景一致，人看不到，实际上还是显示了的。

    
    


   

       
00000000000000000
       
11111111111111111
       
22222222222222222
       
33333333333333333
       
44444444444444444
       
55555555555555555