Value transfer of parent-child components in uniapp

Component pass value

1. Pass value from parent component to child component

通过props来实现, 子组件通过props来接收父组件传过来的值

1 parent component

// 1. 引入子组件
 import Tab from '@/components/tab/tab.vue'
// 2. 在components中对子组件进行注册
export default {
    
    
   components:{
    
    
    	Tab 
	} 

icon

2 subcomponents

//1.通过props接收父组件中传过来的值
 props:['list'],

Display the final effect in the label

2. Passing values ​​from child components to parent components

Child components pass values ​​to parent components through events

1 subcomponent

<template>
	<view @click="send">
    	点击传值
    </view>
</template>
<script>
	export default{
    
    
        methods:{
    
    
            //点击事件
            send: function(){
    
    
                //向父组件传值
                this.$emit("sendData", "我是子")
            }
        }
    }
</script>

2 parent components

<template>
	<view>
    	<zi @sendData="getData"></zi>
   	</view>
</template>

<script>
    //1.导入子组件
	import zi from '../../components/zi.vue';
    //2.注册子组件
    export dufault {
    
    
        components: {
    
    
            zi
        },
        methods: {
    
    
            getData: function(res){
    
    
                console.log(res) //我是子
            }
        }
    }
</script>

Reference link https://blog.csdn.net/weixin_43167546/article/details/107362671