Vuejs tapuscrit ceci. $ Refs. <refField> .value n'existe pas

Question

Lors de la réécriture de mon projet VueJs en tapuscrit, j'ai rencontré une erreur TypeScript.

Ceci est une partie du composant qui a un v-model personnalisé.

Un champ de saisie dans le HTML a une référence appelée «plaque» et je veux accéder à la valeur de cela. Le @input sur ce champ appelle la méthode de mise à jour écrite ci-dessous. Le tapuscrit se plaint que la valeur n'existe pas sur la plaque.

@Prop() value: any; 

update() { 
    this.$emit('input', 
     plate: this.$refs.plate.value 
    }); 
} 

modèle:

<template> 
<div> 
    <div class="form-group"> 
     <label for="inputPlate" class="col-sm-2 control-label">Plate</label> 

     <div class="col-sm-10"> 
      <input type="text" class="form-control" id="inputPlate" ref="plate" :value="value.plate" @input="update"> 
     </div> 
    </div> 

</div> 
</template> 

Answer 1

J'ai trouvé un moyen de le faire fonctionner, mais il est laid à mon avis.

N'hésitez pas à donner d'autres/meilleures suggestions.

update() { 
    this.$emit('input', { 
     plate: (<any>this.$refs.plate).value, 
    }); 
}