Vuex更新state數(shù)據(jù)v組件v-model沒有及時更新問題

Operation:

// 省略代碼
 <!-- collect -->
<div class="col-md-12 sus sus-collect">
    <li v-for="(list,key) in $store.state.list" :key="key" v-if="list.collect">
        <h1>{{list.titles}}</h1>
        <p>{{list.count}}</p>
        <div class="conter">
            <img src="../assets/del.png" alt="刪除" title="刪除">
            <img src="../assets/update.png" alt="修改" title="修改">
            <img src="../assets/copy.png" alt="復制內(nèi)容" title="復制內(nèi)容">
            <div class="conter-time">{{list.time}}</div>
        </div>
    </li>
</div>

Wirte:

<template>
  <div class="col-md-9">
    <form action="" class="bs-emample bs-example-from" v-for="(notes, val) in $store.state.notes" :key="val">
        <div class="input-group input-group-lg sus-mrtop20">
            <span class="input-group-addon">TITLES</span>
            <input type="text" class="form-control" v-model="notes.titles" :value="notes.titles" placeholder="Title">
        </div>
       <textarea name="" id="" cols="30" rows="30" class="form-control sus-mrtop20" v-model="notes.count" placeholder="control"></textarea>
    </form>
  </div>
</template>

<script>
import store from '@/vuex/store'
export default {
  name: 'Write',
  store
}
</script>

<style>

Vuex:

import Vue from 'vue'
import Vuex from 'vuex'
Vue.config.productionTip = false

Vue.use(Vuex)
const state = {
  // 記錄
  list: [
    {
      id: '1',
      titles: '數(shù)組1',
      count: '內(nèi)容1',
      time: '2017-10-30',
      collect: false
    },
    {
      id: '2',
      titles: '數(shù)組2',
      count: '內(nèi)容2',
      time: '2017-10-31',
      collect: true
    }
  ],
  conter: {
    // 刪除記錄index
    index: '1',
    // 復制記錄index,
    copyindex: '1'
  },
  notes: [
    {
      id: '',
      titles: '',
      count: '',
      time: '',
      collect: ''
    }
  ]
}

const mutations = {
  // 刪除記錄
  Del (state, conter) {
    state.list.splice(conter.index, 1)
  },
  // 修改記錄
  Modify (state, conter) {
    // state.notes[0].id
    state.notes[0] = state.list[conter.copyindex]
    console.log(state.notes[0])
    // for (var i = 0; i < Object.keys(clpy).length; i++) {
    //   if (clpy[i].id === state.notes[0]) {
    //     clpy[i] = state.note
    //   }
    // };
  }
}

export default new Vuex.Store({
  state,
  mutations
})

點擊修改后，數(shù)據(jù)更新后沒有及時更新view，有人碰到過這個問題嗎