How to pass new Router to a variable in Vuejs?
0
I created the project using vue-cli and I'm currently learning vue-router.
I want to use the beforeEach function for my authentication and all of tutorial that i have seen pass the new Router function to a variable like var new_value = new Router.
This is what my router looks like
router.vue
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})What I want to achieve is :
var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})When I do this I'm getting an error of Cannot read property type. I'm new to this.
javascript vue.js
edited Dec 11 '18 at 21:54
halfer
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
add a comment |
0
I created the project using vue-cli and I'm currently learning vue-router.
I want to use the beforeEach function for my authentication and all of tutorial that i have seen pass the new Router function to a variable like var new_value = new Router.
This is what my router looks like
router.vue
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})What I want to achieve is :
var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})When I do this I'm getting an error of Cannot read property type. I'm new to this.
javascript vue.js
edited Dec 11 '18 at 21:54
halfer
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
add a comment |
0
0
0
I created the project using vue-cli and I'm currently learning vue-router.
I want to use the beforeEach function for my authentication and all of tutorial that i have seen pass the new Router function to a variable like var new_value = new Router.
This is what my router looks like
router.vue
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})What I want to achieve is :
var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})When I do this I'm getting an error of Cannot read property type. I'm new to this.
javascript vue.js
edited Dec 11 '18 at 21:54
halfer
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
I created the project using vue-cli and I'm currently learning vue-router.
I want to use the beforeEach function for my authentication and all of tutorial that i have seen pass the new Router function to a variable like var new_value = new Router.
This is what my router looks like
router.vue
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})What I want to achieve is :
var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})When I do this I'm getting an error of Cannot read property type. I'm new to this.
export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})export default new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})var new_router = new Router({ // pass the value to new_router
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
}
]
})javascript vue.js
javascript vue.js
edited Dec 11 '18 at 21:54
halfer
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
edited Dec 11 '18 at 21:54
halfer
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
edited Dec 11 '18 at 21:54
halfer
14.4k758109
edited Dec 11 '18 at 21:54
halfer
14.4k758109
edited Dec 11 '18 at 21:54
halfer
14.4k758109
14.4k758109
asked Nov 13 '18 at 1:08
PrizPriz
323215
asked Nov 13 '18 at 1:08
PrizPriz
323215
asked Nov 13 '18 at 1:08
PrizPriz
323215
323215
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
2
I thought the problem is about exporting.
var new_router = new Router({/*Your Options*/});
Do what ever you want:
router.beforeEach(async (to, from, next) => {
// Authentication Checking
});
And you must export
export default new_router;
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
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
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53272318%2fhow-to-pass-new-router-to-a-variable-in-vuejs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
2
I thought the problem is about exporting.
var new_router = new Router({/*Your Options*/});
Do what ever you want:
router.beforeEach(async (to, from, next) => {
// Authentication Checking
});
And you must export
export default new_router;
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
add a comment |
2
I thought the problem is about exporting.
var new_router = new Router({/*Your Options*/});
Do what ever you want:
router.beforeEach(async (to, from, next) => {
// Authentication Checking
});
And you must export
export default new_router;
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
add a comment |
2
2
2
I thought the problem is about exporting.
var new_router = new Router({/*Your Options*/});
Do what ever you want:
router.beforeEach(async (to, from, next) => {
// Authentication Checking
});
And you must export
export default new_router;
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
I thought the problem is about exporting.
var new_router = new Router({/*Your Options*/});
Do what ever you want:
router.beforeEach(async (to, from, next) => {
// Authentication Checking
});
And you must export
export default new_router;
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
answered Nov 13 '18 at 1:24
LucLuc
2,1821538
2,1821538
add a comment |
add a comment |
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%2f53272318%2fhow-to-pass-new-router-to-a-variable-in-vuejs%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