Javascript 为什么即使在Vue中不存在el,挂载钩子也会触发?
我有一个简单的vue实例:Javascript 为什么即使在Vue中不存在el,挂载钩子也会触发?,javascript,vue.js,vuejs2,Javascript,Vue.js,Vuejs2,我有一个简单的vue实例: var vm = new Vue({ el: "#myEl", data: { parent: null, posts: [], total: 0, currentPage: 0 }, mounted: function () { alert("mounted"); } }); 当页面上存在myEl时,一切正常,但如果不存在myEl,挂载程序钩子仍
var vm = new Vue({
el: "#myEl",
data: {
parent: null,
posts: [],
total: 0,
currentPage: 0
},
mounted: function () {
alert("mounted");
}
});
当页面上存在myEl时,一切正常,但如果不存在myEl,挂载程序钩子仍会启动
但是为什么呢?没有要装载实例的元素,所以为什么要装载它呢?
我应该以vue方式如何检查el的存在性?
当el不可用时,组件安装在内存中(类似于
不带参数调用$mount()
控制台中有警告告诉您目标el
找不到
如果不希望发生这种情况,请在检查元素时包装实例,例如
if(document.querySelector('#el'){…}
根据,如果未找到元素,则发出警告并创建一个
在实例化组件之前,您有责任检查元素是否存在()。我这样做的方式,虽然可能不是vue方式,但只是在尝试装载实例之前查询元素。它看起来像:
const element = document.querySelector("#myEl");
if (element) {
var vm = new Vue({
el: element,
...
});
}
谢谢你,但不幸的是,这不是vue的方式:(哇,我没想到会有这么奇怪的行为!你知道vue为什么会这样做吗?@YesMan vue呈现给DOM。