老师,为什么在调用自组件的时候删除方法不能删除父组件的数据

来源:9-8 Vue项目详情页 - 在项目中加入基础动画

目訫

2019-05-04

<template>
  <div>
    <div>
      <input v-model="inputValue" />
      <button @click="handleSubmit" @delete="handleDelete">提交</button>
    </div>
    <ul>
      <todo-item
        v-for="(item, index) of list"
        :key="index"
        :content="item"
        :index="index"
        @click="handleDelete(index)"
      >
      </todo-item>
    </ul>
  </div>
</template>

<script>
import TodoItem from './components/TodoItem'
export default {
  components: {
    'todo-item': TodoItem
  },
  data () {
    return {
      inputValue: '',
      list: []
    }
  },
  methods: {
    handleSubmit () {
      this.list.push(this.inputValue)
      this.inputValue = ''
    },
    handleDelete (index) {
      this.list.splice(index, 1)
    }
  }
}
</script>

<style>
</style>

老师好,为什么handleDelete(index)删除不了父组件list里面的数据

写回答

1回答

Dell

2019-05-05

@click="handleDelete(index)" 改成@click="handleDelete",其实也不行,作用域不对。你为什么要这么做呢?我多次强调,子组件务必不要动父组件的内容

0
4
目訫
回复
Dell
没太懂,老师,不可以这么给方法传参数吗,可以写参数啊
2019-05-05
共4条回复

Vue2.5-2.6-3.0开发去哪儿网App 零基础入门到实战

课程紧跟Vue3版本迭代,企业主流版本Vue2+Vue3全掌握

10675 学习 · 8191 问题

查看课程