element ui 組件 分頁刷新時 當前頁數(shù)會回到默認選中效果

1. vue中vue中刷新頁面，會導致組件狀態(tài)初始化，要記錄刷新前的狀態(tài)，可將刷新前需要存儲在本地存儲里面
2. localStorage 存取數(shù)據(jù)是以字符串的形式存取的
3. 注意current-page的屬性值的類型是Number類型的，而非字符串

`<template>
<div>

<!-- 分頁 -->
<el-pagination 
    background 
    layout="prev, pager, next" 
    @current-change="pageChange" 
    :current-page="pageNo" 
    :page-size="pageSize"
    :total="total">
</el-pagination>

</div>
</template>

<script>
export default {

data() {
  return {
    total: 100,
    pageSize: 5,
    pageNo: 1,
  }
},

created() {
    this.pageNo = Number(localStorage.getItem('pagination')) || 1;
    this.pageChange(this.pageNo);
},

beforeUpdate () {
    localStorage.setItem('pagination', this.pageNo);
},

beforeDestroy () {
    localStorage.setItem('pagination', '1');
},

methods: {
    pageChange (pageNo) {
        this.loading = true;
        this.pageNo = pageNo;
    }    
}

}

</script>
`

vue 做單頁面項目的時候，狀態(tài)是保存在運行狀態(tài)里的，刷新會導致全部重新初始化，要達到你要的刷新后記住，只能做狀態(tài)的本地存儲，通過在localstorage中保存你的頁碼信息，在頁面組件初始化的時候獲取本地存儲的信息，進而初始化，以達到你要的刷新保留狀態(tài)的目的。