object.assign

<template>
  <div>
    <input type="text" v-model="listItem.id">
    <input type="text" v-model="listItem.name">
    <input type="text" v-model="listItem.age">
    <input type="submit" @click="addList">
    <p v-for="item in list" :key="item.id" @click="btnClick(item.id)">{{ item.name }}---{{item.age}}</p>
   
  </div>
</template>

<script>

export default {
  name: "App",
  data() {
    return {
      list:[
        {id:1,name:'小明',age:'16'},
        {id:2,name:'小李',age:'13'},
        {id:3,name:'小黄',age:'19'},
      ],
      listItem:
        {id:'',name:'',age:''}
      
    }
  },
  methods:{
    btnClick(id){
      this.list=this.list.filter((item,index)=>item.id !==id)
    },
  addList(e){
    e.preventDefault()
    // 不拷贝一份的话，点击的时候又给它清空了
    const listItem = Object.assign({},this.listItem)
    this.list.push(listItem)
    this.listItem.id=''
    this.listItem.name=''
    this.listItem.age=''
  }
  },
};
</script>