为什么我无法访问 Vue 3 实例上的 $data？

Question

我遇到了一个奇怪的问题：我无法从 vue 实例访问 data()：

const vueapp = Vue.createApp({
  data(){
    return {
      form:{ .... }
[etc..]

// later:

console.log(vueapp.$data, vueapp.form) // both undefined

为什么？

Answer 1

https://v3.vuejs.org/guide/instance.html#creating-an-application-instance

应用程序及其根组件有细微但重要的不同。您传递给 createApp 的选项在应用程序中不存在，但在其根组件中。

The options passed to createApp are used to configure the root component. That component is used as the starting point for rendering when we mount the application.

const app = Vue.createApp(RootComponent)
const vm = app.mount('#app')

您可以在上面的代码示例中执行 vm.$data 和 vm.form，但不能执行 app.$data 或 app.form。