vue-router

问题 I would like to know how can I stop component reusing in Vue-router. I'm building a simple page application and I am unable to update data after clicking the same link twice. Is it possible to somehow force reloading or what are the best practices in my situation? 回答1: Use the key attribute on router-view set to current url. It's built in, so no need to write any code. <router-view :key="$route.fullPath"></router-view> 回答2: Vue Router reuses the same component therefore the mounted hook won't

问题 I have two different entry points for server.js and client.js.(I'm using vue-server-renderer and laravel-mix) - (my server.js and client.js looks exactly like described here - spatie/laravel-server-side-rendering and if I make static export import Test from '../views/Test' it works.. If I try importing the route without lazy loading, SSR works: import Test from "../views/Test"; export const routes = [{ path: '/my-route', name: "Test", component: Test, }] But if I try lazy-loading, it fails on

问题 I have two different entry points for server.js and client.js.(I'm using vue-server-renderer and laravel-mix) - (my server.js and client.js looks exactly like described here - spatie/laravel-server-side-rendering and if I make static export import Test from '../views/Test' it works.. If I try importing the route without lazy loading, SSR works: import Test from "../views/Test"; export const routes = [{ path: '/my-route', name: "Test", component: Test, }] But if I try lazy-loading, it fails on

问题 I developing a chrome extension with Vue.js. Works fine until I hit the part when I want to use routing. On my local developing server where I have localhost:8080/ this is not a problem when using following routing setup: main.js import Vue from "vue"; import VueRouter from "vue-router"; import App from "./App.vue"; import OptionComponent from "./OptionComponent.vue"; const routes = [ { path: '/', component: App }, { path: '/option', component: OptionComponent }, ]; Vue.use(VueRouter); //

问题 I developing a chrome extension with Vue.js. Works fine until I hit the part when I want to use routing. On my local developing server where I have localhost:8080/ this is not a problem when using following routing setup: main.js import Vue from "vue"; import VueRouter from "vue-router"; import App from "./App.vue"; import OptionComponent from "./OptionComponent.vue"; const routes = [ { path: '/', component: App }, { path: '/option', component: OptionComponent }, ]; Vue.use(VueRouter); //

问题 How can I pass data from my main app to a component through router-view in Vue.js? I have successfully gotten the data from my API as shown below: mounted() { // console.log(model) this.model = model; // console.log(this.model) } The component I want to pass data to has been loaded as shown below: @section('content') <div style="padding: 0.9rem" id="app"> <router-view name="bookBus"></router-view> <router-view></router-view> {{-- @{{ model }} --}} </div> @stop How do I pass the model data to

问题 Whether I do this Vue.router.push({ path: '/beats/catalog/1' }) or this Vue.router.push({ name: 'BeatsCatalog', params: { page: 1 } }) I get the same result: [vue-router] missing param for named route "BeatsCatalog": Expected "page" to be defined. Router: { path: '/beats', components: { navbar: Navbar, default: { template: `<router-view/>` } }, children: [{ name: 'BeatsCatalog', path: 'catalog/:page', components: { default: () => import('@/views/BeatsCatalog') }, props: { default: true } }, {

问题 Whether I do this Vue.router.push({ path: '/beats/catalog/1' }) or this Vue.router.push({ name: 'BeatsCatalog', params: { page: 1 } }) I get the same result: [vue-router] missing param for named route "BeatsCatalog": Expected "page" to be defined. Router: { path: '/beats', components: { navbar: Navbar, default: { template: `<router-view/>` } }, children: [{ name: 'BeatsCatalog', path: 'catalog/:page', components: { default: () => import('@/views/BeatsCatalog') }, props: { default: true } }, {

问题 I am trying to migrate my current site to vuejs. The site map must be: /login /signup /password-reset /browse /search ... dozens of other routes As some of these routes share a lot of fx, I've made them the children of parent routes: [{ // public routes path: '/', component: Auth, children: [ { path: '/login', component: Login }, { path: '/signup', component: Signup }, { path: '/password-reset', component: PasswordReset }, ] }, { // routes behind Authentication path: '/', component: Home,

问题 I am trying to migrate my current site to vuejs. The site map must be: /login /signup /password-reset /browse /search ... dozens of other routes As some of these routes share a lot of fx, I've made them the children of parent routes: [{ // public routes path: '/', component: Auth, children: [ { path: '/login', component: Login }, { path: '/signup', component: Signup }, { path: '/password-reset', component: PasswordReset }, ] }, { // routes behind Authentication path: '/', component: Home,