I'm currently updating a legacy Vue 2.6 app to Vue 3.4, I followed the migration build and its instructions but I'm currently stuck with one component . Indeed I decided to refactor My UiMediaUploader using the new composition API as follow:
<script setup>
import { useDropzone } from "vue3-dropzone";
import axios from "axios";
import { $post, $get, $delegatedUpload } from '@/plugins/Misc';
import { VideoUploader } from '@api.video/video-uploader';
import Media from '@/components/models/Media';
const props = defineProps({
modelValue: {
type: Array,
default: () => []
},
explicit: {
type: Boolean,
default: () => false
},
})
const emit = defineEmits(['update:modelValue'])
....
</script>
But I keep getting this warning :
main.js:102 [Vue warn]: (deprecation COMPONENT_V_MODEL) Component declares "modelValue" prop, which is Vue 3 usage, but is running under Vue 2 compat v-model behavior. You can opt-in to Vue 3 behavior on a per-component basis with `compatConfig: { COMPONENT_V_MODEL: false }`.
Details: https://v3-migration.vuejs.org/breaking-changes/v-model.html
at <UiMediaUploader ref="uploader" modelValue= [] onUpdate:modelValue=fn .
Note: this isn't happening with other components that use the option api which I have successfully updated.
I updated its parent component (UiPost.vue) with the following compatConfig:
compatConfig: {
MODE: 2,
COMPONENT_V_MODEL: false
},
I also tried with MODE 3 but it didn't change anything.