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

<script>
import todoitem from'./components/todoitem'
  export default {
    component :{
      '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>