Vuejs 根和组件结构答案

【问题标题】：Vuejs root and component structureVuejs 根和组件结构
【发布时间】：2021-01-09 07:47:11
【问题描述】：

在documents中，根元素的创建方式如下：

const RootComponent = {
  /* options */
}
const app = Vue.createApp(RootComponent)
const vm = app.mount('#app')

不过，很快我就意识到 createApp() 可以留空：

const app = Vue.createApp({})
app.component('component-a', {
  /* ... */
})
app.mount('#app')

在第二个例子中，根元素是什么？一个默认的？

一个小问题，我知道最好使用 props 和 $emit 来传递数据，但是有没有办法通过 $data 直接访问组件？

【问题讨论】：

标签： vue.js

【解决方案1】：

根组件始终是app 实例。

RootComponent 变量包含app 组件的全局选项（属性）。 (Component Instance Properties)

关于附带问题，您应该考虑组件是否处理应用程序数据（在页面内的不同组件之间共享）或组件与其父级之间的本地数据。

在第一种情况下最好使用状态管理库作为Vuex，否则你应该使用$emit来改变通过props传递给子组件的父数据。

【讨论】：