2.1实现TodoList

  <!--
        Vue 采用MVVM设计模式，数据绑定写法
    -->
    <div id="app">
        <!--
            模板指令
         1.循环指令：v-for:
         2.事件绑定指令 v-on:
         3.inputValue 数据的双向绑定
     -->
        <input type="text" v-model="inputValue">
        <button v-on:click="handleBtnClick">提交</button>
        <ul>
            <li v-for="item in list">{{item}}</li>
        </ul>
    </div>
    <!--
        1.获取元素 '#app'
        2.this.inputValue // 自动寻找data中inputValue 字段并获取值
    -->
    <script>
        var  app = new Vue({
            el:'#app',
            data:{
                list:[],
                inputValue:''
            },
            methods:{
                handleBtnClick:function () {
                    if(!this.inputValue==''){
                        this.list.push(this.inputValue)
                        this.inputValue =''
                    }

                }
            }
        })

    </script>