Styjun

How to explain intravenous drug abuse to a 6-year-old?

Was Mohammed the most popular first name for boys born in Berlin in 2018?

Align a table column at a specific symbol

Visual Studio Code download existing code

What's an appropriate age to involve kids in life changing decisions?

Is it safe to keep the GPU on 100% utilization for a very long time?

How would an instant or sorcery with an effect that targets work with Feather?

"I can't place her": How do Russian speakers express this idea colloquially?

Two (probably) equal real numbers which are not proved to be equal?

Why doesn't increasing the temperature of something like wood or paper set them on fire?

Where do 5 or more U.S. counties meet in a single point?

Texture vs. Material vs. Shader

Is the tensor product (of vector spaces) commutative?

Should one save up to purchase a house/condo or maximize their 401k first?

Opposite party turned away from voting when ballot is all opposing party

Does this website provide consistent translation into Wookiee?

What is the Ancient One's mistake?

Wiper fluid only squirts out for a second - Hyundai Accent 2006

Flooding vs Unknown Unicast Flooding

Capturing the entire webpage with WebExecute's CaptureImage

Is it a good idea to copy a trader when investing?

When an electron around an atom drops to a lower state, is 100% of the energy converted to a photon?

Is there an application which does HTTP PUT?

Did Ham the Chimp follow commands, or did he just randomly push levers?

After I add vuex persist plugin I cannot get store in router

Cannot get object’s property in state before render using Vue + VuexVuex state not preserved after page redirectIntegrate SignalR with Vue.js and VuexHow to test mutations when using vuex modulesAccessing vuex modules data from within a pluginVue.js - Vuex: why is an action dispatched when I import my module stores to a helper file?Listen to actions/mutations from within a vuex modulesSaving data to local storage using vuex persisted staterestore state from localStorage in vuex-persistedstateWhere i may put authorization logic in vue.js?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;

0

After I add vuex persist plugin I cannot get store in router.

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: localStorage
);

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 //plugins: [vuexPersist.plugin] <-- if I comment out this, its working
);

In the router:

router.beforeEach((to, from, next) => 
 console.log(userStorage.state._user);
 next();

The result when the line is commented out:

And when it's not:

Plus info, this is how my store looks like:

import Module, Mutation, VuexModule from "vuex-module-decorators";
import UserResponseDto from "@/common/dto/user-response-dto";
import Utils from "@/common/utils";

@Module
export default class UserStorage extends VuexModule
 _user: UserResponseDto = as UserResponseDto;

 @Mutation
 protected loginUser(user: UserResponseDto) 
 this._user = user;
 

 @Mutation
 protected logoutUser() 
 this._user = as UserResponseDto;
 

 get isLoggedIn() 
 return !Utils.isEmpty(this._user);
 

 get user():UserResponseDto
 return this._user;
 

typescript vue.js vuex

share|improve this question

edited Mar 23 at 7:37

eszik.k

asked Mar 23 at 7:10

eszik.keszik.k

58831026

add a comment | 

0

After I add vuex persist plugin I cannot get store in router.

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: localStorage
);

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 //plugins: [vuexPersist.plugin] <-- if I comment out this, its working
);

In the router:

router.beforeEach((to, from, next) => 
 console.log(userStorage.state._user);
 next();

The result when the line is commented out:

And when it's not:

Plus info, this is how my store looks like:

import Module, Mutation, VuexModule from "vuex-module-decorators";
import UserResponseDto from "@/common/dto/user-response-dto";
import Utils from "@/common/utils";

@Module
export default class UserStorage extends VuexModule
 _user: UserResponseDto = as UserResponseDto;

 @Mutation
 protected loginUser(user: UserResponseDto) 
 this._user = user;
 

 @Mutation
 protected logoutUser() 
 this._user = as UserResponseDto;
 

 get isLoggedIn() 
 return !Utils.isEmpty(this._user);
 

 get user():UserResponseDto
 return this._user;
 

typescript vue.js vuex

share|improve this question

edited Mar 23 at 7:37

eszik.k

asked Mar 23 at 7:10

eszik.keszik.k

58831026

add a comment | 

After I add vuex persist plugin I cannot get store in router.

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: localStorage
);

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 //plugins: [vuexPersist.plugin] <-- if I comment out this, its working
);

In the router:

router.beforeEach((to, from, next) => 
 console.log(userStorage.state._user);
 next();

The result when the line is commented out:

And when it's not:

Plus info, this is how my store looks like:

import Module, Mutation, VuexModule from "vuex-module-decorators";
import UserResponseDto from "@/common/dto/user-response-dto";
import Utils from "@/common/utils";

@Module
export default class UserStorage extends VuexModule
 _user: UserResponseDto = as UserResponseDto;

 @Mutation
 protected loginUser(user: UserResponseDto) 
 this._user = user;
 

 @Mutation
 protected logoutUser() 
 this._user = as UserResponseDto;
 

 get isLoggedIn() 
 return !Utils.isEmpty(this._user);
 

 get user():UserResponseDto
 return this._user;
 

typescript vue.js vuex

share|improve this question

edited Mar 23 at 7:37

eszik.k

asked Mar 23 at 7:10

eszik.keszik.k

58831026

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: localStorage
);

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 //plugins: [vuexPersist.plugin] <-- if I comment out this, its working
);

router.beforeEach((to, from, next) => 
 console.log(userStorage.state._user);
 next();

import Module, Mutation, VuexModule from "vuex-module-decorators";
import UserResponseDto from "@/common/dto/user-response-dto";
import Utils from "@/common/utils";

@Module
export default class UserStorage extends VuexModule
 _user: UserResponseDto = as UserResponseDto;

 @Mutation
 protected loginUser(user: UserResponseDto) 
 this._user = user;
 

 @Mutation
 protected logoutUser() 
 this._user = as UserResponseDto;
 

 get isLoggedIn() 
 return !Utils.isEmpty(this._user);
 

 get user():UserResponseDto
 return this._user;
 

share|improve this question

edited Mar 23 at 7:37

eszik.k

asked Mar 23 at 7:10

eszik.keszik.k

58831026

share|improve this question

edited Mar 23 at 7:37

eszik.k

asked Mar 23 at 7:10

eszik.keszik.k

58831026

asked Mar 23 at 7:10

eszik.keszik.k

58831026

asked Mar 23 at 7:10

eszik.keszik.k

58831026

1 Answer
1

active

oldest

votes

0

That is a normal behavior because you must instruct it to use the localStorage of the current browser window.

There are 2 ways to achieve this:

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: window.localStorage // modified here
);

Or do not precise the storage at all:

const vuexPersist = new VuexPersist(
 key: "vuex"
);

In this later situation, the default storage is: window.localStorage.

In both situations, you must inject the plugin to Vuex:

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 plugins: [vuexPersist.plugin] // Do not comment it out
);

share|improve this answer

answered Mar 23 at 7:20

BegueradjBegueradj

14218

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Unfortunately this solution is not working. I have tried both that you mentioned.
  
  – eszik.k
  Mar 23 at 7:26
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Yes I am using Vue.js with Typescript. I also added plus info for my question.
  
  – eszik.k
  Mar 23 at 7:38
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ok,the vuex-persist its seems to working in vue.ja files .vue but not in my router which is a .ts file. Any idea?
  
  – eszik.k
  Mar 23 at 17:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I found a workaorund but it would better without this. let val = JSON.parse(localStorage.getItem('vuex') as string); let userResponse = val.userStorage._user as UserResponseDto;
  
  – eszik.k
  Mar 23 at 18:10
  
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55311486%2fafter-i-add-vuex-persist-plugin-i-cannot-get-store-in-router%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

That is a normal behavior because you must instruct it to use the localStorage of the current browser window.

There are 2 ways to achieve this:

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: window.localStorage // modified here
);

Or do not precise the storage at all:

const vuexPersist = new VuexPersist(
 key: "vuex"
);

In this later situation, the default storage is: window.localStorage.

In both situations, you must inject the plugin to Vuex:

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 plugins: [vuexPersist.plugin] // Do not comment it out
);

share|improve this answer

answered Mar 23 at 7:20

BegueradjBegueradj

14218

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Unfortunately this solution is not working. I have tried both that you mentioned.
  
  – eszik.k
  Mar 23 at 7:26
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Yes I am using Vue.js with Typescript. I also added plus info for my question.
  
  – eszik.k
  Mar 23 at 7:38
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ok,the vuex-persist its seems to working in vue.ja files .vue but not in my router which is a .ts file. Any idea?
  
  – eszik.k
  Mar 23 at 17:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I found a workaorund but it would better without this. let val = JSON.parse(localStorage.getItem('vuex') as string); let userResponse = val.userStorage._user as UserResponseDto;
  
  – eszik.k
  Mar 23 at 18:10
  
  

  
  
  
  

add a comment | 

0

That is a normal behavior because you must instruct it to use the localStorage of the current browser window.

There are 2 ways to achieve this:

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: window.localStorage // modified here
);

Or do not precise the storage at all:

const vuexPersist = new VuexPersist(
 key: "vuex"
);

In this later situation, the default storage is: window.localStorage.

In both situations, you must inject the plugin to Vuex:

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 plugins: [vuexPersist.plugin] // Do not comment it out
);

share|improve this answer

answered Mar 23 at 7:20

BegueradjBegueradj

14218

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Unfortunately this solution is not working. I have tried both that you mentioned.
  
  – eszik.k
  Mar 23 at 7:26
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Yes I am using Vue.js with Typescript. I also added plus info for my question.
  
  – eszik.k
  Mar 23 at 7:38
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Ok,the vuex-persist its seems to working in vue.ja files .vue but not in my router which is a .ts file. Any idea?
  
  – eszik.k
  Mar 23 at 17:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I found a workaorund but it would better without this. let val = JSON.parse(localStorage.getItem('vuex') as string); let userResponse = val.userStorage._user as UserResponseDto;
  
  – eszik.k
  Mar 23 at 18:10
  
  

  
  
  
  

add a comment | 

That is a normal behavior because you must instruct it to use the localStorage of the current browser window.

There are 2 ways to achieve this:

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: window.localStorage // modified here
);

Or do not precise the storage at all:

const vuexPersist = new VuexPersist(
 key: "vuex"
);

In this later situation, the default storage is: window.localStorage.

In both situations, you must inject the plugin to Vuex:

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 plugins: [vuexPersist.plugin] // Do not comment it out
);

share|improve this answer

answered Mar 23 at 7:20

BegueradjBegueradj

14218

const vuexPersist = new VuexPersist(
 key: "vuex",
 storage: window.localStorage // modified here
);

const vuexPersist = new VuexPersist(
 key: "vuex"
);

const store = new Vuex.Store(
 state: ,
 modules: 
 alertStorage,
 userStorage,
 ,
 plugins: [vuexPersist.plugin] // Do not comment it out
);

share|improve this answer

answered Mar 23 at 7:20

BegueradjBegueradj

14218

answered Mar 23 at 7:20

BegueradjBegueradj

14218

answered Mar 23 at 7:20

BegueradjBegueradj

14218