Watch + Emit - Vue 3 (C.A)

dataToParent.vue

// first of all: props are for parent -> child and we can use emit for child -> parent

// parent-component.vue

<card-stats
  @goalReachedPercentage="getReachedGoalValue"
/>

const getReachedGoalValue = (percent) => {
    datas.indicatorGoalPercentage.push(percent)
    console.log(datas.indicatorGoalPercentage);
}

// child-component.vue

emits: ['goalReachedPercentage'],

// watching something change and firing an emit:

watch(
            () => value,
            (currentValue, oldValue) => {
                emit(
                    'goalReachedPercentage',
                    goalPercentage.value >= 100 ? 100 : goalPercentage.value
                )
            },
            
            // optional
            { immediate: true }
)