Vue第一节

基本格式

       

      Document

 

   

      {{msg}}

   


二:用V-for做table表格

body代码:

               编号

                名字

                价格

                {{value.num}}

                {{value.name}}

                {{value.price}}

js代码:

new Vue({

        el:'#app',

        data:{

            arr:[1,2,3,4,5],

            obj:{name:'jack',old:'18'},

            arrs:[

                {num:1,name:'香蕉',price:3},

                {num:2,name:'苹果',price:2},

                {num:3,name:'鸭梨',price:1},

            ]

        }

})

三:v-model

dody代码:

           //v-model  双向绑定   一般只用于表单

{{message}}

js代码:

new Vue({

    el:'#app',

    data:{

        message:''

    }

})

四:v-on

点击button会弹出111

body部分:

    按钮

js部分:

new Vue({

    el:'#app',

    data:{

        message:'hello World'

    },

    methods:{

        alt:function(){

            alert(111)

        }

     }

})

你可能感兴趣的:(Vue第一节)