Question

<script>
  export default {
    props: ['propsdata'],
    methods: {
      removeTodo(todoItem, index) {
        localStorage.removeItem(todoItem);
        this.todoItems.splice(index, 1);
      }
    }
  }
</script>

<template>
  <section>
    <ul>
      <li v-for = "(todoItem, index) in propsdata" class = "shadow">
        <i class = "checkBtn fas fa-check" aria-hidden = "true"></i>
        {{ todoItem }}
        <span class = "removeBtn" type = "button" @click = "removeTodo(todoItem, index)">
          <i class = "fas fa-trash" aria-hidden = "true"></i>
        </span>
      </li>
    </ul>
  </section>
</template>

未捕获的类型错误：无法读取未定义的属性'splice'。这些错误继续发生。请帮助我。

Answer 1

在组件方法中引用this.todoItems时，Vue希望该方法来自传入的props，由组件定义的data或作为computed属性。

来自模板

<li v-for = "(todoItem, index) in propsdata" class = "shadow">
                                  ^^^^^^^^^

在我看来，您所说的todoItems是1）propsdata或2）propsdata内的一个属性。如果我们正在寻找选项1），则将propsdata重命名为todoItems，反之亦然。如果是2），则不要引用this.todoItems，而是this.propsdata.todoItems

未捕获的类型错误：无法读取未定义的属性“接头”

1 个答案: