vue-router

问题 I have the following VueRouter route { path: '/playlists/:id', name: 'videos', component: Video, props: { videos: [] }, beforeEnter (to, from, next) { Vue.axios.get('/playlistitems?playlistId='.concat(to.params.id)) .then((response) => { to.params.videos = response.data next((vm) => { console.log(vm) vm.videos = response.data }) }) .catch((err) => console.log('error', err)) } } When the route is entered into everything executes as expected but I'm not sure how to pass the response.data to the

问题 I've eliminated all the ways of 'next' being called twice to prevent loops. Everything seems to work except what's going on inside the if (authenticated) block. The goal is to keep the user stuck at the RegisterFlow page until they've verified & provided a display name. Where am I going wrong? Error: Uncaught (in promise) RangeError: Maximum call stack size exceeded Code: const authPages = ["LoginPage", "Register", "ForgotPass"]; const publicPages = ["PrivacyPolicy", "Terms"]; router

问题 I have a Vue.js application, currently I render it using different pages. I have run into an issue where when I login the first time it will only render the single main component that is the page according to vue router. I am looking for a way to have my login function run then go to /dashboard but I'd like it to rerender my App.vue file or find some way to reload my header and sidebar in the below code as sign now the header and sidebar don't display when I am on /login so the router.push('

问题 Hi I need to understand how to "pass" some $store values from settings module to header module, being the $store updated by settings module I have this app.vue module: <template> <v-app> <router-view name="sidebar" /> <router-view name="header" :handleSettingsDrawer="handleSettingsDrawer" /> <v-main class="vue-content"> <v-fade-transition> <router-view name="settings" /> </v-fade-transition> </v-main> <router-view name="footer" /> <app-settings-drawer :handleDrawer="handleSettingsDrawer"

问题 I have setup a Vuex store and router in Vue. Depending on a piece of state within this store, I would like the router to render a different component for the same path. Below is my attempt at doing this. Within my router, I include a conditional that is saying "if the user is logged in, return Home , otherwise return Login ". Within my Login component, I change the value of my loggedIn state (within the Vuex store) to true when the user successfully logs in. I have tested and can see this

问题 I would like to get from which page a user came from in my page. Currently, I would like to get this info in my created() or mounted() pages. Using this.$router or this.$route but none of them contain this info. I know in the navigation guards, we can use this : router.beforeEach((to, from, next) => { }) to know where the page is comming from, but I don't want to use router.beforeEach because that is in found inside my main.js but where I want to get the referer is in my components page,

问题 I was experiencing some trouble while deploying a Vue application build with vue-cli v3.0. to GitHub Pages. I'm using subtree to send the dist folder only to gh-pages branch. First the problem was that the assets where not found but I fixed it using baseUrl on vue.config.js . Now the problem is that the #app element is empty. I found out that if I don't use vue-router (render the view direct instead of using <router-view/> ) the app works fine with GitHub pages. I believe there is some issue

问题 I was experiencing some trouble while deploying a Vue application build with vue-cli v3.0. to GitHub Pages. I'm using subtree to send the dist folder only to gh-pages branch. First the problem was that the assets where not found but I fixed it using baseUrl on vue.config.js . Now the problem is that the #app element is empty. I found out that if I don't use vue-router (render the view direct instead of using <router-view/> ) the app works fine with GitHub pages. I believe there is some issue

问题 With Vue Router version 4 , which is currently in beta.11 in vue-router-next repo, there is a documentation page about how to define meta fields custom type interface with TypeScript . declare module 'vue-router' { interface RouteMeta { // is optional isAdmin?: boolean // must be declared by every route requiresAuth: boolean } } To be placed along the Vue shim module declaration. Mine is looking like: declare module '*.vue' { import { defineComponent } from 'vue'; const component: ReturnType

问题 With Vue Router version 4 , which is currently in beta.11 in vue-router-next repo, there is a documentation page about how to define meta fields custom type interface with TypeScript . declare module 'vue-router' { interface RouteMeta { // is optional isAdmin?: boolean // must be declared by every route requiresAuth: boolean } } To be placed along the Vue shim module declaration. Mine is looking like: declare module '*.vue' { import { defineComponent } from 'vue'; const component: ReturnType