<template>

  <div>

  <div>

   <input class="mgs" type="text" v-model="inputValue"/>

   <button @click="aaa">提交</button>

     </div>

   <ui>

   <todo-item

    v-for='(item,index) of list'

    :key='index'

    :content='item'

    :index='index'

    @delete='ccc'

    ></todo-item>

   </ui>

   </div>

</template>

<script>

import TodoItem from './components/TodoItem'

export default {

components:{

'todo-item':TodoItem

},

    data(){

    return{

    inputValue:'',

    list:[]

    }

    },

    methods:{

    aaa(){

    this.list.push(this.inputValue)

    this.inputValue=''

    },

    ccc(index){

    this.list.splice(index,1)

    }

    }

  }

</script>

<style>

</style>