批量删除之刷新后的vuex中数据丢失

今天做练习，做批量删除这个功能，multipleSelection是复选框自带的   （勾选中的数组）

一。

 

 

如果找不到就返回-1

二。然后就出现控制台里 数据已经删除，而页面没删除，是因为 页面只是初始化时变量接渲染了，现在state种变化，是不会变的 所以刷新了一下

 

三。接着刷新后 页面又重置了（vuex刷新后页面重置），然后在app中加入以下代

 

 

 

<script>

  export default{

     created(){

     //在页面加载时读取sessionStorage里的状态信息

    if (sessionStorage.getItem("store") ) {

        this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))

    }

    //在页面刷新时将vuex里的信息保存到sessionStorage里

    window.addEventListener("beforeunload",()=>{

        sessionStorage.setItem("store",JSON.stringify(this.$store.state))

    })

  }

  }

</script>