2018-09-10 Vue框架

new Vue(){      //el是element的简写     el后面跟的是选择器

 el:'#app',

    data:{

        message:'Hello Vue.js!'

}

}

这是创建的一个简单的Vue应用。

一：v-for

  {{Value}}   

      //值在arr中循环    value是一个值   可变

 {{Value}}  

       //值在obj中循环    value是一个值   可变

 {{index}}==>{{value}}  

 //arr的元素对应的下标

 {{index}}==>{{value}}  

 //obj的元素对应的下标

     //输出的是arrs数组中的对象中的元素值

 {{value.name}} 

{{value.name}}

{{value.price}}

二:v-model 双向数据绑定 一般只适用于表单元素

例：

new Vue({

            el:'.itany',

            data:{

                msg:''

            }

        })

 三：v-on    事件    v-on：事件名=‘函数（方法）’    简写@事件名=‘函数’

例：

按钮

new Vue({

            el:'.itany',

            data:{

              msg:'hello vue'

          },

          methods:{

              alt:function(){

                  alert(this.msg)

              }   

          }

        })

四：methods:{

alt:function(){

alert(你好)}