将 Vue 对象附加到元素的最推荐语法是什么？

Question

将 Vue 实例附加到 HTML 元素时，我可以采用两种方式。

参考属性，el:"#rooty"
通过方法调用，$mount("#rooty")

我无法在他们之间做出决定。它们是否完全等价？如果一个是更新的或过时的，推荐哪个？还有其他区别吗？在这种情况下，它会是什么？

参考属性。

const app = new Vue({
  store,
  router,
  el: "#rooty",
  ...
});//.$mount("#rooty");

通过方法调用。

const app = new Vue({
  store,
  router,
  //el: "#rooty",
  ...
}).$mount("#rooty");

Answer 1

从 documentation 看来，$mount() 的目的是有一个未挂载的 vue 实例，稍后再挂载它。来自文档：

If a Vue instance didn’t receive the el option at instantiation, it will be in “unmounted” state, without an associated DOM element. vm.$mount() can be used to manually start the mounting of an unmounted Vue instance.

我相信 el:"#rooty" 只是在 $mount 上提供给用户的语法糖，因为在内部 $mount 用于将实例附加到 HTML 元素。请参阅下面的代码 vue repo:

export function initRender (vm: Component) {
  ...
  ...
  // bind the createElement fn to this instance
  // so that we get proper render context inside it.
  // args order: tag, data, children, needNormalization, alwaysNormalize
  // internal version is used by render functions compiled from templates
  vm._c = (a, b, c, d) => createElement(vm, a, b, c, d, false)
  // normalization is always applied for the public version, used in
  // user-written render functions.
  vm.$createElement = (a, b, c, d) => createElement(vm, a, b, c, d, true)
  if (vm.$options.el) {
    vm.$mount(vm.$options.el)
  }
}

将 Vue 对象附加到元素的最推荐语法是什么？

Which is the most recommended syntax for attaching Vue object to an element?

html

javascript

vue.js

vue-router

vuex