javascript - Vue Router: URL does not load correct component while router-link does -
my project uses vue2 , vue router. want able load component stats typing in url http://example.com/stats.
- url
http://example.com/statsnot work, i'm redirected/, loadsappcomponent <router-link :to="/stats">go stats</router-link>works perfectly
i know whether vue router issue or server configuration issue. i'd mention fact experience issue both in localhost , server using nginx.
how fix this?
app.js:
const routes = [ { path: '/', component: app }, { path: '/stats', component: stats }, { path: "*", component: pagenotfound }, { path: '/admin', meta: { requiresadmin: true }, component: admin}, { path: "/not-authorized", component: notauthorized }, ]; vue.use(vuerouter); const router = new vuerouter({ mode: 'history', routes, }) const app = new vue({ el: '#app', router, data () { return {} }, }); router.beforeeach((to, from, next) => { if (to.matched.some(record => record.meta.requiresadmin)) { if (!store.state.isadmin) { axios.post('/isadmin').then((response) => { if(response.data.isadmin){ next(); } else { next({ path: '/not-authorized', }) } }); } else { next(); } } else { next(); } } else { next(); // make sure call next()! } });
have configured web-server return same page regardless of url? way app can load, , url preserved routing can take on , select right component once it's loaded.
this answer https://stackoverflow.com/a/7027686/7816087 suggests following config nginx:
location / { try_files $uri /base.html; }
Comments
Post a Comment