v-model does not work with arrays

[fernandoelantana]

}Hello,
I have a component with a prop that expects an array.

modelValue: {
    type: Array<any>
    default: () => []
}

and my parent component looks like this:

<script setup>
    const myArray: Array<any> = reactive([]
</script>

<template>
    <my-component
        v-model="myArray"
    >
    </my-component>
</template>

When I emit the event "update:modelValue" the expected behaviour is to have the underlying ref to be updated with the contents. But instead is setting the whole array as a whole:

myArray = emited array

I would like v-model to behave like this:

    function onUpdate(array: Array<any>): void {
        myArray.length = 0
        myArray.push(....array)
    }

    <my-component
        :model-value="myArray"
        @update:model-value="onUpdate"
    >
    </my-component>

How can I handle this using a directive?

Thank you

[catpigdog]

Under existing functionalities, if you want to pass components, you may need to use ref.

const myArray=ref<any []>([])