VUE的component和components

// 全局组件的使用Vue.component
// Vue.component("TodoItem",{
//  props: ['content'],
//  template: "<li>{{content}}</li>"
// })

// 局部组件的使用components
var TodoItem = {
        props: ['content'],
        template: "<li>{{content}}</li>"
    }
    var app = new Vue({
        //el: '#app',
        el: '#root',
        components: {           // 局部组件的使用components
            TodoItem: TodoItem
        },
        data: {
            list: [],
            // list: ['第一节课的内容','第二节课的内容','第三节课的内容']
            inputValue: ''
        },
        methods: {
            handleBtnClick: function(){
                // alert(this.inputValue);
                this.list.push(this.inputValue);  //
                this.inputValue = '';             //（双向绑定）提交一段item数据后，输入框的内容将清空
            }
        }
    })