vue 点击添加水果

<template>
  <div id="app">
    <input type="text" v-model='str'>
	   <ul>
       <li v-for='item in arr' v-text='item'></li>
     </ul>
     <button @click='addFruit'>添加水果</button>
  </div>
</template>

<script>
  export default{
    data(){
      return{
       str:'',
       arr:['香蕉','草莓']
      }
    },
    methods:{
      addFruit(){
        this.arr.push(this.str)
      }
    }
  }
</script>