vue使用query傳參,重新整理頁面資料丟失

阿新 • • 發佈：2020-12-10

技術標籤：vue

使用params路由傳參的時候資料會丟失,所以選擇了query,但是重新整理頁面的時候報錯 [object,object]
記錄:

component:  demo1
let data={id:1;name:"張三"}
 this.$router.push({path:'/demo2',query:{data:data}})

component2:  demo2
let tableData=this.$route.query.data

重新整理頁面列印 tableData報錯
在這裡插入圖片描述
解決辦法如下:

component:  demo1
 this.$router.push({path:'/demo2',query:{data:JSON.stringify(data)}})

component2:  demo2
let tableData=this.$route.query.data
this.tableList=JSON.parse(tableData)

技術標籤：vue 使用params路由傳參的時候資料會丟失,所以選擇了query,但是重新整理頁面的時候報錯 [object,object] 記錄:

概述常見場景：點選列表的詳情，跳轉到詳情內頁，在內頁根據傳遞的引數獲取詳情資料。

重新整理頁面時vue例項重新載入，store就會被重置，可以把定義重新整理前把store存入本地localStorage、sessionStorage、cookie中，localStorage是永久儲存，重新開啟頁面時會讀取上一次開啟的頁面資料，sessionStor

在做vue專案的過程中有時候會遇到一個問題，就是進行F5頁面重新整理的時候，頁面的資料會丟失，出現這個問題的原因是因為當用vuex做全域性狀態管理的時候，store中的資料是儲存在執行記憶體中的，頁面重新整理時會重

原因：因為store裡的資料是儲存在執行記憶體中的,當頁面重新整理時，頁面會重新載入vue例項，store裡面的資料就會被重新賦值初始化

解決vuex頁面重新整理導致資料丟失問題 vuex資料是存在記憶體當中，當頁面重新整理之後vuex資料自然會丟失。我們有兩種方法解決該問題:

檢視資料 : 程式碼示例 : <input type=\"text\"> <button class=\"set\">儲存資料</button>

Override the entrypoint of an image Introduced in GitLab and GitLab Runner 9.4. Read more about the extended configuration options.

導語：我們在寫vue專案的時候，經常要用到vuex作為記憶體來儲存，但是我們存放在vuex中的資料（使用者資料，當前頁面的資料等等）在重新整理後就會丟失，那麼如何解決呢？超級簡單。

Vue不斷請求資料用定時器SetTimeOut 不帶引數發給後端 <template> <div> <el-button @click=\"getData\">點選</el-button>

Vue Router 傳參方式： 1. this.$router.push({ name: \'模組名稱\',params: { // 各引數 } }) router.js：

解決 vuex 重新整理後資料丟失問題問題描述我們在寫 vue 專案的時候，經常會用到 vuex 作為記憶體來儲存，例如一般在登入成功的時候需要把使用者資訊，選單資訊等放置 vuex 中，作為全域性的共享資料。

技術標籤：前端vuejsvuejavascriptvue.js前端 this.$router.push(path:\'/diyName\',query:{ a:1, b:2,c:3})

技術標籤：vue $router傳參 json 最近專案中涉及到跨頁面傳引數和後臺進行資料互動，看到需求之後第一反應就是用路由傳參來解決；Vue中給我們提供了三種路由傳參方式，下面我們一個一個的來看一下：

2020-12-15 js ajax請求傳參及java後端資料接收後端controller的程式碼 Controller： package com.ysl.PassingParameters.controller;

目錄前言一、原因：二、解決思路：1.本地儲存方法:2.實現步驟：3.優化：前言

一、store資料丟失系統登入後獲取到系統選單列表存入store中，發現在重新整理頁面之後，store中的選單資料丟失了。

頁面重新整理後，原有的 x 中的 state 會發生改變，如果在頁面重新整理之前，可以將 state 資訊儲存，頁面重新載入時，再將該值賦給 state，那麼該問題即可解決。

本文例項講述了vue跳轉方式（開啟新頁面）及傳參操作。分享給大家供大家參考，具體如下：