猿问

vue这个里面谁是父组件谁是子组件？

父组件是counter-event-example吗？子组件是button-counter吗？counter-event-example不就是一个div标签吗哪里是组件了？v-on是在监听吗？如果是这样的话不是自己监听自己吗？一直分不清哪个是父组件哪个是子组件也搞不清emit的用法怎么办？
{{total}}
Vue.component('button-counter',{
template:'{{counter}}',
data:function(){
return{
counter:0
}
},
methods:{
increment:function(){
this.counter+=1//组件模板中的counter
this.$emit('increment1')//触发自定义事件，这里的参数是自定义事件名称
}
},
})
newVue({
el:'#counter-event-example',
data:{
total:0
},
methods:{
incrementTotal:function(){
this.total+=1//父实例下的total
}
}
})

		

			
绝地无双

			
浏览 346回答 2

		

	
	

									
	

	

		
2回答

		

			
			

				
				
忽然笑

				
你看你注册了一个组件button-counter,然后这个组件在counter-event-example里面调用了，所以它是counter-event-example的子组件。之后你想在button-counter里面调用父组件counter-event-example的方法，就要在使用子组件button-counter的时候把父组件的方法传进去，然后在子组件中$emit这个方法传入参数调用。

				

					

            
            
          

          
0

				

			

			
			

				
				
慕妹3146593

				
对，父组件是counter-event-example，子组件是button-counter，父子组件就是在注册一个组件的时候引用了另一个组件，component1component2是兄弟组件，你的那个是父子组件。父组件那个是监听，监听子组件，在子组件的事件中去写this.$emit(),就会触发incrementTotal这个自定义事件。

				

					

            
            
          

          
0

				

			

			
		

	

	

		随时随地看视频慕课网APP
	

	
	
	

		
相关分类

		

			
			

			
				 JavaScript
			
			

				
			
		

	

	
	
	

		我要回答