码迷,mamicode.com
首页 > 其他好文 > 详细

vue demo

时间:2017-06-30 19:57:22      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:win   his   func   parent   v-on   typeof   r.js   char   blog   

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="traceur.js"></script>
    <script src="BrowserSystem.js"></script>
    <script src="bootstrap.js"></script>
    <script src="vue.js"></script>
</head>
<script  type="text/traceur">
window.onload=function(){
    Vue.config.devtools = true;
    
    var parent = {
        data(){
            return {
                a:10,
            }
        },
        template: <div @click="pc" >---parent{{a}} -- , <child v-on:increment="incrementTotal" :m.sync="a"></child></div>,
        methods:{
            pc:function(){
                this.a += 0;
            },
            incrementTotal:function(){
                //alert(12344444);
                //this.a = -100;
            },
        },
        components:{
            "child":{
                data(){ // data:function(){  简写
                    return {
                        b:def,
                        c:0,
                    }
                },
                props:[m],
                mounted(){
                    this.c = this.m;
                },
                template:<div @click="cc">child child,<strong>{{typeof m}},{{m}},{{c}},</strong><i>,{{b}},</i></div>,
                methods:{
                    cc:function(){
                        //this.b += 2;
                        this.c += 200;
                        this.m += 100;  //不建议直接操作m,
                        //alert(789);
                        //this.$emit(‘increment‘);
                        //alert(456);
                    }
                },
            }
        }
    }

    var app3 = new Vue({
      el: #app-3,
      data:{
      },
      
      methods:{
      },
      
      components:{
        parent:parent,
      },
      
      computed:{
      }
      
    })
    
};

</script>
<style>
</style>
<body>
<div id="app-3" >
    <parent></parent>==========
</div>
</body>
</html>

 

vue demo

标签:win   his   func   parent   v-on   typeof   r.js   char   blog   

原文地址:http://www.cnblogs.com/yaowen/p/7100186.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!