首页 > 解决方案 > [Vue 警告]:v-on 处理程序中的错误:“TypeError:无法读取未定义的属性 'Array'”

问题描述

我想在单击按钮时检查输入是否为空如果其中一个输入为空,则过滤数组我尝试向数组添加错误,但是当我单击按钮时出现错误“'ErrorList' undefined"我认为错误是我试图在一个名为ErrorList的方法中调用一个数组save,但是我该如何解决这个问题呢?你也可以在codesandbox中查看我的代码

<template>
  <div>
    <form>
      <div v-for="(learning, i) in general.learnings" :key="i">
        <input type="text" v-model="general.learnings[i]" maxlength="120" />
      </div>

      <button @click="save">Save</button>
    </form>
  </div>
</template>

<script>
export default {
  methods: {
    save(e) {
      e.preventDefault();

      this.general.learnings.filter(function (el) {
        if (el !== "") {
          return true;
        } else {
          this.errorList.push("Error");
        }
      });
    },
  },
  data() {
    return {
      errorList: [],
      general: {
        learnings: ["", ""],
      },
    };
  },
};
</script>

标签: javascriptarraysvue.jsvuejs2

解决方案


发生这种情况是因为引用 ofthis没有引用您在filter.

只需更改为箭头功能即可解决问题。

 this.general.learnings.filter( (el) => {
        if (el !== "") {
          return true;
        } else {
          this.errorList.push("Error");
        }
      });

推荐阅读