2018-09-19 组件制作的删除和添加

<div id='app'>
      <my-father></my-father>
  </div>
   <script src='js/vue.js'></script> 
   <script>
       Vue.component('my-father',{
           template:`
                <div>
                        <input v-model="a">
                        <button v-on:click="fun">添加</button>
                     <ul>
                            <li v-for="(value,index) in list">
                            {{value}}

                            <button v-on:click="fun1(index)">删除</button>
                            </li>
                    </ul>
                </div>
           `,
           data:function(){
               return{
                   list:["apple","orange","banana"],
                   a:""  //-
               }
           },
           methods:{
               fun1:function(ind){
                   this.list.splice(ind,1)   //删除
               },
               fun:function(){
                   this.list.push(this.a)   //添加
               }

           }
       })

       
       new Vue({
           el:'#app'
       })
    
    </script>