Vue中父子组件通讯——组件todolist

<div id="root">
        <div>
            <input type="text" v-model="inputValue">
            <button @click="handleSubmit">提交</button>
        </div>
        <ul>
            <li v-for="(item, index ) of list" :key="index">{{item}} </li>
        </ul>
    </div>
    <script>
    new Vue({
        el:"#root",
        data:{
            inputValue:'',
            list:[]
        },
        methods:{
            handleSubmit:function(){
                this.list.push(this.inputValue);
                this.inputValue='';
            }
        }
    })
    </script>

View Code