Javascript 带数据的Vue.js模板

我已经使用Vue.js几天了，每次按下enter按钮时，我都会尝试在输入中添加一个新的div，其中包含文本。你能帮我复习一下这个代码吗

脚本

window.onload = function () {
        Vue.component('todo-item', {
            props: ['todo'],
            template: '<div id="div{{todo.id}}">{{ todo.text }}</div>'
        });

        var app7 = new Vue({
            el: '#app-7',
            data() {
                return {
                    divList: [],
                    textInput:''
                }
            },
            methods: {
                addUser() {                        
                    return this.divList.push({
                        id: + new Date,
                        text: textInput
                    });
                }
            }
        });
}

window.onload=函数（）{
Vue.组件（'待办事项'{
道具：[待办事项]，
模板：“{todo.text}}”
});
var app7=新的Vue({
el:“#app-7”，
数据（）{
返回{
divList:[]，
文本输入：“”
}
},
方法：{
addUser（）{
返回此.divList.push({
id:+新日期，
文本：文本输入
});
}
}
});
}

HTML

<div id="app-7">
              <input v-model="textInput" v-on:keyup.enter="addUser" />
              <todo-item v-for="item in divList" v-bind:todo="item" v-bind:key="item.id"></todo-item>
          </div>

在JavaScript控制台上，如果我检查app7.textInput的值，我会发现它没有正确绑定…

谢谢，我刚刚不得不更改并删除缓存

         methods: {
                        addUser() {
                            return this.divList.push({
                                id: + new Date,
                                text: this.textInput
                            });
                        }
                    }

---

在

addUser

方法中，

textInput

前面缺少

this

。它应该是

text:this.textInput

。