：属性'0”在渲染期间被访问，但未在实例上定义
P粉311423594
2023-09-02 09:04:09
<p>我对 Vue3 还很陌生，我正在使用 Vue 构建一个小型入门门户，并且在名为 <code>const ProgressStage = ref(0)</code> 的“App.vue”文件中使用全局状态并根据该状态渲染特定组件。</p>
<p>我还必须发出传递的处理程序来更改progressStage的状态</p>
<p>在此处查看代码：</p>
<pre class="brush:php;toolbar:false;"><script setup>
import {ref} from 'vue';
import ComponentA from 'components/componentA.vue' (moc components)
import Component B from 'components/componentB.vue'
const progressStage = ref(0)
const data = ref({})
function handleNavigation(newVal){
progressStage = newVal
}
function handleClientDataAdd(newData){
const newData = {...data.value,newData}
data.value = newData;
}
</script>
<template>
<ComponentA
v-show:progressStage === 0
/>
<ComponentB
@handle-page-nav="handleNavigation"
@handle-client-data="handleClientDataAdd"
v-show:progressStage === 1
/>
</template></pre>
<p>在我的 ComponentB 内部 ->
另外，正在调用错误的那个：
<strong>在 <ComponentB onClientDataAdd=fn onHandlePageNav=fn
在应用程序中。</strong></p>
<pre class="brush:php;toolbar:false;"><script setup>
import {ref} from 'vue'
const emits = defineEmits(['handlePageNav','clientDataAdd']
const data = ref({
name:''
}) (mock object)
</script
<template>
<input v-model="data.name" /></pre>
<p>我有多个其他组件也使用状态来动态安装自身，但 ComponentB 似乎不断（在输入中的每次击键时）抛出上述警告</p>
<p><strong>希望得到一些帮助</strong></p>
第一个错误是
v-show:progressStage === 0。将其更改为：v-show="progressStage === 0"。 文档：v-if-on 模板。p >并且
clientDataAdd但您调用事件：handle-client-data。将其更改为：@client-data-add="handleClientDataAdd"