亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

萌新求教!vue項目: 刷新頁面讓未提交的form表單不發生變化,并且在切換組件后提示用戶該頁面數據有變動您尚未保存是否跳轉的功能

萌新求教!vue項目: 刷新頁面讓未提交的form表單不發生變化,并且在切換組件后提示用戶該頁面數據有變動您尚未保存是否跳轉的功能

DIEA 2019-09-08 21:26:37
vue項目:刷新頁面讓未提交的form表單不發生變化,并且在切換組件后提示用戶該頁面數據有變動您尚未保存是否跳轉的功能,有誰做過嗎?做過的,能否讓我參考一下代碼。沒做過的,能否一起討論一下。###問題描述問題出現的環境背景及自己嘗試過哪些方法相關代碼//請把代碼文本粘貼到下方(請勿用圖片代替代碼)你期待的結果是什么?實際看到的錯誤信息又是什么?
查看完整描述

2 回答

?
慕慕森

TA貢獻1856條經驗 獲得超17個贊

刷新頁面讓未提交的form表單不發生變化,方法1:把數據存到Cookie或者sessionStorage,刷新時候created()中讀取,表單提交后清空數據。方法2:使用vuex,表單綁定的數據,在刷新后重新附給vuex暫存的數據,提交后清空。
并且在切換組件后提示用戶該頁面數據有變動您尚未保存是否跳轉的功能給提交按鈕綁定事件進行狀態控制,沒有點擊的時候狀態為false,點擊過后變為true,離開當前頁面,也就是組件銷毀(beforeDestroy)的時候判斷綁定狀態是否為true,進行彈框提示。
補充:在方法2的時候,實測vuex在刷新頁面后數據會丟失,保存的值也就丟失了,針對這個問題,如果要使用vuex,則需要監聽刷新頁面的事件,在檢測到刷新的時候把vuex的state存到sessionStorage里。所以還是方法1,比較可用。
                            
查看完整回答
反對 回復 2019-09-08
  • 2 回答
  • 0 關注
  • 291 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號