: La propriété '0' a été accédée lors du rendu mais n'est pas définie sur l'instance
P粉311423594
P粉311423594 2023-09-02 09:04:09
0
1
655
<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>
P粉311423594
P粉311423594

répondre à tous(1)
P粉011912640

La première erreur est v-show:progressStage === 0。将其更改为:v-show="progressStage === 0". Documentation : modèle v-if-on. p>

et 已发出 clientDataAdd 但您调用事件:handle-client-data。将其更改为:@client-data-add="handleClientDataAdd"

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal