uni-app组件之间的传值子传父进行通信

最新推荐文章于 2024-07-05 16:39:48 发布

Specialize in Linxu

最新推荐文章于 2024-07-05 16:39:48 发布

阅读量456

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/qq_44170622/article/details/109500738

版权

小程序专栏收录该内容

80 篇文章 4 订阅

订阅专栏

子组件

<template>
	<view class="">
		测试
		{{title}}
		<view @click="sendNum">
			1111
		</view>
	</view>
	
</template>

<script>
	
	export default {
		
		data() {
			return {
				num:12
			}
		},
		props:['title'],
		
		methods: {
			sendNum(){
				this.$emit('sendNum',this.num)
			}
		},
		
	}
</script>


<style>
</style>

父亲

<template>
                 <view class="container">
                 	<Test :title="title" @sendNum="getNum"></Test>
					<text>{{num}}</text>
                 </view>

</template>

<style lang="scss" scoped>
	
</style>
<script>
	 import Test from '../../components/Test/Test.vue';
	export default {
		components:{
			Test
		},
		data() {
			return {
				title:'hello',
				num:''
			}
		},
		methods: {
			getNum(num){
			this.num=num
			}
		},
		
	}
</script>