Cannot use vuex store getters from nuxt.js Middleware
0
I have getters setup within my Vuex store that I can access. I can also see the getters if I output the context.store.getters object in the console from my Middleware.
The problem is that if I try to actually use the getters in my Middleware (e.g., context.store.getters.userType) I receive errors that they are undefined. Is there anyway to access the getters from middleware?
Here is my middleware:
export default function (context) {
console.log("context.store.getters", context.store.getters);
console.log("context.store.getters.getUserType",
context.store.getters.getUserType)
if (context.store.getters.getUserType == "adv") {
return router.push('/adv')
} else if (context.store.getters.getUserType == "applicant") {
return router.push('/app')
}
}
However, you can see that there is actually a defined and resultant "userType" getter in the store via the console:
Thanks for the help.
vue.js vuex nuxt.js
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
|
show 3 more comments
0
I have getters setup within my Vuex store that I can access. I can also see the getters if I output the context.store.getters object in the console from my Middleware.
The problem is that if I try to actually use the getters in my Middleware (e.g., context.store.getters.userType) I receive errors that they are undefined. Is there anyway to access the getters from middleware?
Here is my middleware:
export default function (context) {
console.log("context.store.getters", context.store.getters);
console.log("context.store.getters.getUserType",
context.store.getters.getUserType)
if (context.store.getters.getUserType == "adv") {
return router.push('/adv')
} else if (context.store.getters.getUserType == "applicant") {
return router.push('/app')
}
}
However, you can see that there is actually a defined and resultant "userType" getter in the store via the console:
Thanks for the help.
vue.js vuex nuxt.js
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output ofcontext.store.gettersbut not incontext.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?
– akaHeimdall
Jan 1 at 21:54
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49
|
show 3 more comments
0
0
0
I have getters setup within my Vuex store that I can access. I can also see the getters if I output the context.store.getters object in the console from my Middleware.
The problem is that if I try to actually use the getters in my Middleware (e.g., context.store.getters.userType) I receive errors that they are undefined. Is there anyway to access the getters from middleware?
Here is my middleware:
export default function (context) {
console.log("context.store.getters", context.store.getters);
console.log("context.store.getters.getUserType",
context.store.getters.getUserType)
if (context.store.getters.getUserType == "adv") {
return router.push('/adv')
} else if (context.store.getters.getUserType == "applicant") {
return router.push('/app')
}
}
However, you can see that there is actually a defined and resultant "userType" getter in the store via the console:
Thanks for the help.
vue.js vuex nuxt.js
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
I have getters setup within my Vuex store that I can access. I can also see the getters if I output the context.store.getters object in the console from my Middleware.
The problem is that if I try to actually use the getters in my Middleware (e.g., context.store.getters.userType) I receive errors that they are undefined. Is there anyway to access the getters from middleware?
Here is my middleware:
export default function (context) {
console.log("context.store.getters", context.store.getters);
console.log("context.store.getters.getUserType",
context.store.getters.getUserType)
if (context.store.getters.getUserType == "adv") {
return router.push('/adv')
} else if (context.store.getters.getUserType == "applicant") {
return router.push('/app')
}
}
However, you can see that there is actually a defined and resultant "userType" getter in the store via the console:
Thanks for the help.
vue.js vuex nuxt.js
vue.js vuex nuxt.js
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
edited Jan 1 at 20:34
akaHeimdall
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
asked Jan 1 at 10:37
akaHeimdallakaHeimdall
3422319
3422319
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output ofcontext.store.gettersbut not incontext.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?
– akaHeimdall
Jan 1 at 21:54
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49
|
show 3 more comments
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output ofcontext.store.gettersbut not incontext.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?
– akaHeimdall
Jan 1 at 21:54
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output of
context.store.getters but not in context.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?– akaHeimdall
Jan 1 at 21:54
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output of
context.store.getters but not in context.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?– akaHeimdall
Jan 1 at 21:54
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49
|
show 3 more comments
0
active
oldest
votes
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
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53994780%2fcannot-use-vuex-store-getters-from-nuxt-js-middleware%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
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
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53994780%2fcannot-use-vuex-store-getters-from-nuxt-js-middleware%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
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
Required, but never shown
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
Required, but never shown
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
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
It just mean that at time when middleware executed value inside your getter is undefined.
– Aldarund
Jan 1 at 11:38
Thanks @Aldarund. Is there a way to have the app wait for them to be defined before usage?
– akaHeimdall
Jan 1 at 20:31
They are defined. I mean that value in that specific getter is undefined, and your code that put some value in it run after middleware
– Aldarund
Jan 1 at 21:02
@Aldarund, it actually is defined. Take a look at the console log image. You see the value in the output of
context.store.gettersbut not incontext.store.getters.userType. I see the value actually is defined. And it's also shown in my Vue Chrome Debugger, but it's not coming through when I explicitly call it. Is there something else I'm missing?– akaHeimdall
Jan 1 at 21:54
The thing is that when you log in console context.store.getters it log reference to the object. And the actual values will only be evaluated when you click. So its different moment from when you log.
– Aldarund
Jan 1 at 22:49