vue + store2實現未提交信息自動保存

自動保存因意外退出而將來得及提交的註冊信息

前提條件

  • 未提交。提交過的註冊信息不予保存
  • 意外退出。正常退出的註冊信息不予保存

實現方法

  • 保存註冊信息,用store2來作。
    可是,怎麼解決另外一個用戶想註冊的時候不會恢復上一個用戶的註冊信息呢?
    用sessionStorage,關閉瀏覽器則sessionStorage保存的信息清空
  • 未提交,也就是提交事後的不予保存。定義一個flag, 用戶提交信息並返回ok
    後,置flag爲false,在路由離開的鉤子裏判斷flag爲false則無需保存。
  • 意外退出。其實在路由離開的鉤子裏提醒用戶"是否肯定離開?",便可以
    避免因意外退出丟失將來得及保存的註冊信息。

總結

因此,個人方案是,①在路由離開鉤子裏提醒用戶"是否肯定離開?"
②在路由離開鉤子裏默默爲用戶保存還沒有提交的註冊信息,而且用sessionStorage
保存,以防用戶信息穿混。vue

後記

另外一種自動保存的需求出如今編輯郵件、我的簡介等長篇幅的寫內容中,常見
的是自動保存,也就是用定時器保存信息。至於保存在哪裏?建議保存在服務端
不建議保存在客戶端。由於是非短期的寫內容,用戶可能在多平臺、多時段
編輯,並且用戶是已登陸的,利於服務端按用戶id進行存儲。git

vue-storage

這是一個用vuejs + store2 + bootstrap-vue實現的** 自動保存因意外退出而將來得及提交的註冊信息** 小demogithub

項目相關資源

GIT地址bootstrap

相關文章
相關標籤/搜索