Vue子组件传递信息到父组件
首页 > Vue    作者:lininn   2017年6月21日 14:44 星期三   热度:1356°   百度已收录  
时间:2017-6-21 14:44   热度:1356° 
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="bower_components/vue/dist/vue.js"></script>
	<style>
	</style>
</head>
<body>
    <div id="box">
        <aaa></aaa>
    </div>
    <template id="aaa">
    <h3>我喜欢->{{msg}}</h3>
    <bbb @msg="get"></bbb>
    </template>

    <template id="bbb">
        <input type="button" @click="send()" value="说实话">
    </template>
	<script>
	 new Vue({
     el:"#box",
     
     components:{
         aaa:{
             data(){
                 return {
                    msg:"linin.cn"
                 }
             },
              methods:{
         get:function(msg){
             this.msg=msg
         }
     },
             template:"#aaa",
             
            
             components:{
               bbb:{
                        template:"#bbb",
                        data(){
                        return {
                            name1:"you"
                        };
                    },
                    methods:{
                        send:function(){
                        this.$emit("msg",this.name1);
                        }
                    }




               }
             }
         }
     }

    });
	</script>
</body>
</html>
二维码加载中...
本文作者:lininn      文章标题: Vue子组件传递信息到父组件
本文地址:?post=7
版权声明:若无注明,本文皆为“覆手为雨”原创,转载请保留文章出处。
分享本文至:

返回顶部    首页    手机版本    后花园   会员注册   
版权所有:覆手为雨    站长: lininn