SOURCE

new Vue({
  el: "#app",
  data: {
    list: [
      {id:1},
      {id:2},
      {id:3},
      {id:4},
      {id:5},
    ]
  },
  methods: {
    doShift () {
      this.list.shift()
      console.log('shift:'+this.list)
    },
    doUnshift () {
      this.list.unshift('f')
      console.log('unshift:'+this.list)
    },
    doPop () {
      this.list.pop()
      console.log('pop:'+this.list)
    },
    doPush () {
      this.list.push('e')
      console.log('push:'+this.list)
    },
    reset () {
      this.list = [1,2,3,4,5]
    }
  }
})

<div id="app">
  {{ list }}<button v-on:click="reset">reset</button>
  <br />
  <button v-on:click="doShift">shift</button>
  <button v-on:click="doUnshift">unshift</button>
  <button v-on:click="doPop">pop</button>
  <button v-on:click="doPush">push</button>
</div>