[Vuejs]-Reactive Prop Input Vue3

0👍

The solution goes into the direction of Dimavas proposal in his comment.

I had to do a little more though to make it fit for my needs.

@toggle-select="isSelected($event, true)" :isSelected='isSelected(course, false)'

The components emit now executes isSelected(). The event contains the data of the emit, also i pass in true as a second argument.

isSelected looks like this:

const isSelected = (_courseData :any, _update: boolean) :boolean => {
    if(_update) {
        handleSelect(_courseData)
    }
    if (selectedCourses.value?.some((e: any) => e == _courseData)) {

        return true
    }
    else {
        return false
    }
}

The _update-Bool we passed in earlier is there to stop this solution from entering an infinite loop, as isSelected() is also called in the isSelected-prop of my component. There we pass in false to stop the recursion.

Leave a comment