Как выбрать текущий элемент в дочернем компоненте после монтирования родительского?

Question

[Avivar]

Допустим в родительском компоненте после монтирования происходит запрос к серверу и получение данных. На основе полученных данных мы получаем массив доступных элементов, которые в упрощенном варианте выводятся в select. А также можем получить значение текущего элемента ( при условии что нужно отредактировать элемент).
Так вот событие onMounted в дочернем компоненте происходит раньше чем в родительском. Это приводит к тому, что не происходит выбора текущего элемента в select.
Пример простого дочернего компонента приведен ниже.
Подскажите пожалуйста как правильно будет реализовать данную задачу?

<template>
            <select
                v-model="supportSelect"
                style="max-width: 350px">
                <option value="">Не использовать</option>
                <option v-for="(item, index) in technicalSupportList"
                        :value="item.id"
                        :key="item.id">
                    {{ item.name }}
                </option>
            </select>
</template>

<script>
import {onMounted, ref, unref, watch} from "vue";

export default {
    props: {
        technicalSupport: {
            type: Array
        },
        current:{
            type: Object
        }
    },

    setup(props, context){
        let supportSelect = ref('');
        let technicalSupportList = ref([]);
        technicalSupportList.value = props.technicalSupport;

        onMounted(()=>{
            supportSelect.value = props.current.id ?? ''
            
        })

        return {
            supportSelect,
            technicalSupportList
        }
    }
}
</script>