: Harta '0' telah diakses semasa pemaparan tetapi tidak ditakrifkan pada contoh

Question

Saya agak baru menggunakan Vue3, saya sedang membina portal permulaan kecil menggunakan Vue dan dalam fail "App.vue" yang dipanggil const ProgressStage = ref(0) nyatakan dan jadikan komponen tertentu berdasarkan keadaan itu.

Saya juga terpaksa mengeluarkan pengendali yang diluluskan untuk menukar status progressStage

Lihat kod di sini:

<setup script>
import {ref} daripada 'vue';
import ComponentA daripada 'components/componentA.vue' (komponen moc)
import Komponen B daripada 'komponen/komponenB.vue'
const progressStage = ref(0)
data const = ref({})
function handleNavigation(newVal){
  progressStage = newVal
}
function handleClientDataAdd(newData){
 const newData = {...data.value,newData}
 data.value = newData;
}
</skrip>

<template>
<KomponenA
v-show:progressStage === 0
/>
<KomponenB
@handle-page-nav="handleNavigation"
@handle-client-data="handleClientDataAdd"
v-show:progressStage === 1
/>
</template>

Di dalam KomponenB saya -> Juga, yang salah dipanggil: Dalam

<setup script>
import {ref} daripada 'vue'
const emits = defineEmits(['handlePageNav','clientDataAdd']

data const = ref({
nama:''
}) (objek olok-olok)
</skrip

<template>
<input v-model="data.name" />

Saya mempunyai berbilang komponen lain yang turut menggunakan keadaan untuk memasang sendiri secara dinamik, tetapi ComponentB nampaknya terus memberikan amaran di atas (pada setiap ketukan kekunci dalam input)

Berharap bantuan

Answer 1

Kesilapan pertama ialah v-show:progressStage === 0。将其更改为：v-show="progressStage === 0". Dokumentasi: templat v-jika-on. p>

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