關於uni-app父子頁面的傳值

1.父傳子

Father.vue

<template>
    <view>
        <Son :toSonData="toSonData"></Son>
    </view>
</template>
<script>
import Son from "./Son.vue";
export default{
    data(){
        return{
            toSonData:"給子頁面的信息"
        }
    },
    components:{
        Son
    }
}
</script>

Son.vue

<template>
    <view>
        父頁面給的信息{{toSonData}}
    </view>
</template>
<script>
export default{
    props:["toSonData"],//第一種接收方式
    props:{//第二種接收方式
        toSonData:{
            type:string,
            default:function(){
                return ''
            }
        }
    }
}
</script>

2.子傳父

Son.vue

<template>
    <view>
        <view @click="toFatherData"></view>
    </view>
</template>
<script>
export default{
    methods:{
        toFatherData(){
            this.$emit("toFatherData","子頁面給父頁面的信息")
        }
    }
}
</script>

Father.vue

<template>
    <view>
        <Son @toFatherData="sendFatherData"></Son>
    </view>
</template>
<script>
import Son from "./Son.vue"
export default{
    data(){
        return{
            sendFatherData:""
        }
    },
    components:{
        Son
    },
    methods:{
        sendFatherData(data){
            this.sendFatherData=data;
        }
    }
}
</script>