Javascript Vue组件属性未定义

遗憾的是，我对Vue不太熟悉，希望有人能帮我一点忙

我的index.html中有以下内容：

。。。

现在，我有了我的xyz组件：

Vue.component（'graph'{
道具：['isHidden']，
观察：{
伊希登（）{
doSomething（this.ishiden）；
}, ...
}
....
}

然后，我有了我的Vue应用程序：

let app=new Vue({
el:'根'，
方法：{
行动（）{
this.hidden=！this.hidden；
}, ...
}, ....
数据：{隐藏：错误}
})

现在，正如我所理解的那样：hidden=“isHidden”part应该将不同部分中的两个变量绑定在一起，对吗？因此，当我更改

isHidden

时，它也应该更改

hidden

，因此调用执行某些操作的监视函数。但事实证明，当加载组件时，

hidden

尚未定义

---

我是否忘记了什么？或者我的错误可能在代码的“…”部分？-。

数据部分应是一个函数：

data () { 
  return {
    isHidden: false 
  }
}

---

您忘记了使用组件道具和标记名称，组件名称应该相同

 new Vue({
      el: '#app',
      components: {
        'xyz': xyz,
      }
    })

组件名称

Vue.component('xyz', {
      props: ['hidden'],
      watch: {
        hidden() {
         doSomething(this.hidden);
        }, ...
      }
    ....
    }

---

这个链接应该可以帮助你：

哦，等等……现在我觉得自己很愚蠢

嗯，还有其他人在挣扎：在Vue HTML中没有大字母（camelCase）..

固定HTML：

。。。

其余的可以保持不变