: La propriété '0' a été accédée lors du rendu mais n'est pas définie sur l'instance
<p>Je suis assez nouveau sur Vue3, je construis un petit portail de démarrage en utilisant Vue, et dans un fichier "App.vue" appelé <code>const ProgressStage = ref(0)</code> état et restituer des composants spécifiques en fonction de cet état. </p>
<p>J'ai également dû émettre le gestionnaire transmis pour modifier l'état du progressStage</p>
<p>Voir le code ici : </p>
<pre class="brush:php;toolbar:false;"><configuration du script>
importer {ref} depuis 'vue' ;
importer ComponentA depuis 'components/componentA.vue' (composants moc)
importer le composant B à partir de 'components/componentB.vue'
const progressStage = réf(0)
données const = réf({})
fonction handleNavigation(newVal){
progressStage = newVal
}
fonction handleClientDataAdd (newData) {
const newData = {...data.value,newData}
data.value = newData;
}
</script>
<modèle>
<ComposantA
v-show:progressStage === 0
/>
<ComposantB
@handle-page-nav="handleNavigation"
@handle-client-data="handleClientDataAdd"
v-show:progressStage === 1
/>
</template></pre>
<p> À l'intérieur de mon composant B ->
De plus, le mauvais nom est appelé :
<strong>Dans <ComponentB onClientDataAdd=fn onHandlePageNav=fn
Dans l'application. </strong></p>
<pre class="brush:php;toolbar:false;"><configuration du script>
importer {ref} depuis 'vue'
const émet = définirEmits(['handlePageNav','clientDataAdd']
const données = réf({
nom:''
}) (objet fictif)
</script
<modèle>
<input v-model="data.name" /></pre>
<p>J'ai plusieurs autres composants qui utilisent également l'état pour s'installer dynamiquement, mais ComponentB semble continuer à émettre l'avertissement ci-dessus (à chaque frappe dans l'entrée)</p>
<p><strong>J'espère de l'aide</strong></p>
