Vue.js 中的“挂载”是什么意思？答案

【问题标题】：What does "mount" mean in Vue.js?Vue.js 中的“挂载”是什么意思？
【发布时间】：2023-04-10 16:40:01
【问题描述】：

使用 vue.js 的实例来定位 DOM 元素时，“mount”是什么意思？（即使是简单的英语？）。例如以下：

这段代码创建了一个新的 Vue 实例并将其挂载到 HTML 具有应用 ID 的元素。
const app = new Vue().$mount('#app');
当 Vue 实例有 el 选项时，它会自动挂载到那个元素

【问题讨论】：

将其附加到 DOM。
我认为这意味着它将应用程序引导到一个 html 元素作为应用程序视图的容器。

标签： javascript vue.js

【解决方案1】：

在用户看到任何东西之前，安装发生在 Virtual Dom 级别。

当您 $mount('#app') 时，将设置一个 'el' 参数。这个 'el' 定义了这个实例将被“挂载”到的元素的 ID。

因此，在您的模板中，如果您有一个想要成为已安装组件的元素，那么在您的组件声明中，您可以使用“el:#app”来安装它。

VueJS 生命周期图：https://vuejs.org/v2/guide/instance.html#Lifecycle-Diagram

已安装的生命周期挂钩：https://vuejs.org/v2/api/#mounted

【讨论】：

【解决方案2】：

vue 中的挂载是什么？在 vue 中，每个实例首先作为虚拟 DOM 对象（虚拟 html 元素）存储在内存中。当 Vue 创建那些对真实 DOM 可见的组件（虚拟 DOM）时（实际 html 元素），它创建虚拟 DOM 的那一刻变成了真实的DOM 被称为“安装”。随着应用程序状态的变化，vue 会检测用户期望看到的变化，并将数据变化从内存中放入真实的 DOM。这称为“更新”。整个过程称为Vue Lifescyclehooks，分为四个阶段，即create,mount,update and destroyed。

【讨论】：