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

Question

将Vue实例附加到HTML元素时,我可以通过两种方式完成.

1. 通过属性引用,el:"#rooty"
2. 通过方法调用,$ mount("#rooty")

我不能在他们之间做出决定.它们是否完全相同？如果一个是新的或过时的,推荐哪一个？还有其他差异,在这种情况下,会是什么？

通过财产参考.

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

通过方法调用.

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

Answer 1

从文档中可以看出， 的目的$mount()是拥有一个未挂载的 vue 实例并稍后挂载它。来自文档：

\n

\n

如果 Vue 实例在实例化时没有接收到 el 选项，它将处于 \xe2\x80\x9cunmounted\xe2\x80\x9d 状态，没有关联的 DOM 元素。vm.$mount() 可用于手动开始挂载已卸载的 Vue 实例。

\n

\n\n

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

\n

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

\n