Paramètres de script Vue 3 Typescript | Paramètre "el" implicitement entré dans la référence du modèle

Question

Quelqu'un peut-il me dire pourquoi TypeScript me crie dessus avec l'erreur suivante ? error TS7006：参数“el”隐式具有“any”类型。 ref="(el) => saveRef(index, el)".我很确定 saveRef Le type correct est défini dans la fonction.

<script lang="ts" setup>
    import FormComponent from '@/components/FormComponent.vue'

    const formRefs = ref<
      ComponentPublicInstance<typeof FormComponent>[]
    >([])

    function saveRef(
      index: number,
      el: ComponentPublicInstance<typeof FormComponent>
    ) {
      formRefs.value[index] = el
    }

    onBeforeUpdate(() => {
      formRefs.value = []
    })
  </script>

  <template>
    <div v-for="(component, index) in components" :key="index">
      <form-component
        :ref="(el) => saveRef(index, el)"
        :component="component"
        :index="index"
      />
   </div>
 </template>

Answer 1

Laisser du JS redondant dans les modèles n'est généralement pas une bonne pratique. La bonne solution consiste à définir des fonctions de gestion de références typées dans le script du composant. Puisqu'elle doit être paramétrée, il peut s'agir d'une fonction d'ordre supérieur :

function saveRef(
  index: number,
) {
  return (el: ComponentPublicInstance) => {
    formRefs.value[index] = el
  }
}

et utilisez-le comme :ref="saveRef(index)".