[Vue 警告]：找不到元素

小编典典

all

我正在使用Vuejs。这是我的标记：

<body>
  <div id="main">
    <div id="mainActivity" v-component="{{currentActivity}}" class="activity"></div>
  </div>
</body>

这是我的代码：

var main = new Vue({
    el: '#main',
    data: {
        currentActivity: 'home'
    }
})
;

当我加载页面时，我收到此警告：

[Vue warn]: Cannot find element: #main

我究竟做错了什么？

阅读 156

2022-07-06

共1个答案

小编典典

我认为问题在于您的脚本是在目标 dom 元素加载到 dom 之前执行的……原因之一可能是您已将脚本放在页面头部或放在 div
元素之前的脚本标记中#main. 因此，当脚本执行时，它将无法找到目标元素，因此会出现错误。

一种解决方案是将您的脚本放在加载事件处理程序中，例如

window.onload = function () {
    var main = new Vue({
        el: '#main',
        data: {
            currentActivity: 'home'
        }
    });
}

另一种语法

window.addEventListener('load', function () {
    //your script
})

2022-07-06