API композиции Vue вызывает метод дочернего компонента

Question

TL; DR; В версии 2 this.$refs выполняет эту работу, но как я могу это сделать в API композиции v3?

Я пытаюсь использовать функцию CustomUpload PrimeVue в Vue3, но этот API не очищает файлы загрузки после их загрузки, и мне нужно вызвать clear() метод дочернего компонента в родительском компоненте, чтобы очистить файлы и обновить кнопку.

Вот мой App.vue

<template>
  <FileUpload
    name="upload"
    url="/"
    mode="basic"
    :auto="true"
    :maxFileSize="26214400"
    :fileLimit="1"
    :customUpload="true"
    @uploader="upload"
  />
  <Button name="lalaal">qweeq</Button>
</template>

<script>
import FileUpload from 'primevue/fileupload'

export default {
  setup() {
    const upload = e => {
      console.log('testing', e)
    }
    return { upload }
  },
  components: {
    FileUpload
  }
}
</script>

благодаря

Answer 1

Вы можете использовать шаблон ref, а затем использовать uploadFile.value вместо this.$refs.uploadFile:

<template>
  <FileUpload
    ref="uploadFile"
    name="upload"
    url="/"
    mode="basic"
    :auto="true"
    :maxFileSize="26214400"
    :fileLimit="1"
    :customUpload="true"
    @uploader="upload"
  />
  <Button name="lalaal">qweeq</Button>
</template>

<script>
import FileUpload from 'primevue/fileupload'
import {ref} from "vue";

export default {
  setup() {
    const uploadFile=ref(null)
 
    
    const upload = e => {
      console.log('testing', e)
    }
    return { upload,uploadFile}
  },
  components: {
    FileUpload
  }
}
</script>