Javascript [Vue warn]：属性或方法“hp”未在实例上定义，但在渲染期间被引用

我有以下代码：

var example1;
var hp = ["p"];

document.addEventListener("DOMContentLoaded", function(event) {
  hp = ["x"];
  example1 = new Vue({
    el: '#example-1', //yes i have an element with #example-1 (not relevant here)
    data: {
      iLoveMyself: window.hp
    },

    watch: {
      iLoveMyself: {
        deep: true,
        immediate: true,
        handler (val, oldVal) {
          console.log("yeeeh")
        }
      }
    }
  })
});

我尝试了很多东西，这就是为什么我的代码如此丑陋，但我保留了这个控制台。错误：

vue.js:634 [Vue warn]: Property or method "hp" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

如果我在VueJs的chrome插件中查找该值，则数据集如下所示：

iLoveMyself:Array[1]
0:"x"

目前一切正常，但在尝试更新hp时，如：

hp.push("y");
hp.pop();
hp = "ZEBRA";

我没有得到任何回应

我不明白的是什么

提前感谢

编辑： 因此，在我开始将这些信息收集起来之后，我的html毕竟很重要：/

<div id="example-1">
  <div v-for="ev in hp" :key="ev.beavus">
    {{ ev.beavus }}
  </div>
</div>

你应该做：

<div id="example-1">
  <div v-for="ev in iLoveMyself" :key="ev.beavus">
    {{ ev.beavus }}
  </div>
</div>

你应该做：

<div id="example-1">
  <div v-for="ev in iLoveMyself" :key="ev.beavus">
    {{ ev.beavus }}
  </div>
</div>

---

以下是您在问题中所发布内容的更为惯用的Vue实现：

新Vue{ el:‘示例1’， 数据：{ 我自己：[{beavus:x}] }, 观察：{ 我自言自语：{ 深：是的， 立即：是的， 处理程序val，oldVal{ 控制台，罗吉耶 } } }, 方法：{ 加{ 这是我自己推{beavus:Math.random} } } }; {{ev.beavus} 添加

---

以下是您在问题中所发布内容的更为惯用的Vue实现：

新Vue{ el:‘示例1’， 数据：{ 我自己：[{beavus:x}] }, 观察：{ 我自言自语：{ 深：是的， 立即：是的， 处理程序val，oldVal{ 控制台，罗吉耶 } } }, 方法：{ 加{ 这是我自己推{beavus:Math.random} } } }; {{ev.beavus} 添加

---

该错误表示您正试图在模板中使用名为hp的属性。但是，您尚未在Vue实例上定义名为hp的属性。在示例代码中，有一个名为ILOVEIMY的属性。您有一个名为hp的变量，但该变量在模板中无法访问，即使它是全局变量。它必须是实例的属性，否则模板将无法看到它。请共享template@skirtle我很困惑，给我一点时间please@BoussadjraBrahim我在hp references hp中为=ev制作了一个editv。您需要将其更改为ILOVEIMY以匹配实例上的属性。或者将iLoveSelf重命名为hp。该错误表示您试图在模板中使用名为hp的属性。但是，您尚未在Vue实例上定义名为hp的属性。在示例代码中，有一个名为ILOVEIMY的属性。您有一个名为hp的变量，但该变量在模板中无法访问，即使它是全局变量。它必须是实例的属性，否则模板将无法看到它。请共享template@skirtle我很困惑，给我一点时间please@BoussadjraBrahim我在hp references hp中为=ev制作了一个editv。您需要将其更改为ILOVEIMY以匹配实例上的属性。或者将我自己重命名为hp。是的，这确实消除了错误，但在更新var hp i get no Response时，该属性不是反应性的，请精确说明您的用例，我们希望找到一种尊重VueI范例的方法，认为使用observable适合您的案例检查本文是的，确实消除了错误，尽管如此，当更新var hp i get no responsethat属性不是反应性的时，请精确说明您的用例，我们希望找到一种尊重VueI范式的方法，认为使用observable适合您的用例检查本文