如何通过全局监听事件在页面加载时自动获取子组件的数组数据

Question

问题遇到的现象和发生背景

uniapp 子组件如何向父组件传递数组？不通过点击函数，可通过全局监听事件，在页面加载时自动获取子组件数组的数据，求例子

用代码块功能插入代码，请勿粘贴截图

<!-- 父组件 -->
<template>
    <view>
        <son @sonEven='getSonText'></son>
    </view>
</template>

<script>
    import son from '@/uni_modules/Cloud-API/components/Cloud-API/Cloud-API.vue'
    export default {
        data() {
            return {
                array: []
            }
        },
        methods: {
            getSonText(array1) {
                this.array = array1
            }
        },
        components: {
            son
        }
    }
</script>

<!-- 子组件 -->
<template>
    <view>
        <!-- 向父组件传值 -->
        <button @click="toFather">点击向父组件传值</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                array: [1, 2, 3, 4]
            }
        },
        methods: {
            toFather() {
                this.$emit('sonEven', this.array)
            }
        }
    }
</script>

我的解答思路和尝试过的方法

全局监听事件不太清晰，不知道什么原因

我想要达到的结果

不通过点击函数，可全局监听事件在页面加载时自动获取数组

Answer 1

<!-- 子组件 -->
<template>
    <view>
        <!-- 向父组件传值 -->
        <button>点击向父组件传值</button>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                array: [1, 2, 3, 4]
            }
        },
        methods: {
        }
    }
</script>

<!-- 父组件 -->
<template>
    <view @click="test">
        <son ref="procedureEdit"></son>
    </view>
</template>
 
<script>
    import son from './son.vue'
    export default {
        data() {
            return {
                array: []
            }
        },
        mounted() {
            this.array=this.$refs.procedureEdit.$data.array
        },
        methods: {
            test(){
                console.log(this.array)
            }
        },
        components: {
            son
        }
    }
</script>