Questions tagged [vue-router]

Vue Router is a routing library for single-page applications designed for use with the Vue.js framework.

0
votes
0answers
18 views

Textarea height not updating on page mount

I have an auto-expanding text area and I have cases where there is text populated inside (when editing, for example). I want the text area to be fully expanded to show all the text that's there. The ...
0
votes
0answers
12 views

Deployment issue w/Vue-cli3 and static site

New to vue and am using vue-cli3 to scaffold a simple authentication app for auth0, auth0-plugin.surge.sh. My router.js module is: import Vue from "vue"; import Router from "vue-router"; import Home ...
0
votes
1answer
20 views

Vue router remove params from URL

I have a route set up like below. The idea is that if a user clicks a referral link then the key is stored. In the future if the user navigates to the path /store the same component is used and the ...
0
votes
2answers
13 views

How to auto change page with vue-router?

As the title suggests, there are two pages in the code. I want to show the page HelloWorld first then show next page myPage without any click. (maybe 2 sec after..) How to auto change a page with vue-...
0
votes
1answer
16 views

How to use Laravel authentication and vue-router together

I'm new to Laravel and PHP in general, but familiar with Vue and SPA's. I know how to create authentication with Bcrypt, for example. However, I used Laravel to run php artisan make:auth and to create ...
6
votes
1answer
63 views

How to sync states between backend and frontend using vuex and vue-router?

I am developing a single-page-application using vue-cli3 and npm. The problem: Populating a basic integer value (stored in a vuex state) named counter which was incremented/decremented in the backend ...
0
votes
1answer
21 views

blank the field on Submit (vee-validate vue)

I'm creating a form in Vue having validation of Vee-validate. I want to make field blank on submit. But it is giving an error when I make the field blank on submit. Can someone please help me to ...
0
votes
2answers
22 views

Disable nuxt link based on boolean

I can't seem to find a good way to disable a nuxt-link based on a data variable. Could anyone suggest something? I've tried looking at doucmentation but I can't come up with anything. Say I have a ...
-2
votes
1answer
24 views

why URL Query string appears in middle of hostname and the path name… Vuejs?

I'm learning VueJs,and i want to develop a register page, but I think something is wrong here, I have a click event to submit the data and when I click in the button to submit it, I print the data in ...
0
votes
2answers
18 views

How to correct, Maximum call stack size exceeded, vue-router?

Good day. I have the following error: [vue-router] uncaught error during route navigation: vue-router.esm.js:1897 RangeError: Maximum call stack size exceeded at String.replace (<anonymous>)...
1
vote
3answers
98 views

How to access this variable from my store / state in my vue router?

I have setup my routes.js file to import my state from my store. This is working as when I console.log(state) it outputs my store to console successfully: I then define my route as below: routes.js ...
0
votes
1answer
16 views

laravel + vue router cannot get parameters from url

I try to get parameters from url let's say url contains: localhost:8000/blog?q=hello I want to grab hello to trigger function call What I had declare in app.js in laravel webpack: import ...
0
votes
1answer
38 views

Vue.js - Unknown custom element: <router-view>

I'm bit new to Vue.js and I'm trying to implement routing to the application but for some reason I'm facing an issue saying: Unknown custom element: <router-view> - did you register the ...
0
votes
1answer
10 views

Vuejs router and beforeEach hook

I’ve encountered an issue with beforeEach hook of vue-router : I checked the authentification of the user with a router.beforeEach hook in my main.js like this : router.beforeEach((to, from, next) =&...
0
votes
0answers
25 views

Nuxt JS page content flicker when changing pages

I'm using Nuxt JS v2.4.5 with Bootstrap Vue, I have a fixed header and a page footer that are located inside of my default.vue file. When I scroll to the bottom of a page and click a link in the ...
0
votes
2answers
19 views

PDP page gets redirected to 404 for some products

I need some help with this issue in Vue Storefront that I have had some difficulty trying to solve: After navigating to PDP(Product Detail Page) and refreshing the page, the page gets redirected to ‘...
1
vote
1answer
35 views

Router-View tag doesn't display content with beforeEach()

I have a vue-router that works as designed, but the moment I add the beforeEach() function to it, nothing appears in the <router-view> tags. Even if the beforeEach() function is empty, it still ...
0
votes
1answer
25 views

Deploy Vue CLI on Azure App Service with History mode

Hi is there anyone who has deployed there application to azure app service and got the history mode to work? I have been trying on and off, and cant get it work :S Im using connect-history-api-...
0
votes
0answers
29 views

Always use root as base url with Vue-Router

I use a mix between Laravel and Vue-Router, so I have my main app that uses someurl.com/ as my base however when I use a standard Laravel navigation over to someurl.com/settings I can't then use my ...
0
votes
1answer
30 views

Delete not working for Vue Route against API

I am trying to setup a basic system where I can edit and delete values from a table. Been following a couple of guides and have hit a stumbling block. <tbody> <tr v-for="(product,index) in ...
1
vote
1answer
25 views

What does double asterisk mean in vue router path?

I have seen some vue router configuration included this patter in path like: {path: "**", component: Xxx} What does this mean and what is difference compared with path: "*" ?
0
votes
0answers
9 views

Nuxt: rendering pages based on query

I want to render certain pages/components based on the query string like /profile?tab=settings should renders the settings page/component in profile. The directory structure: -| profile/ -----| ...
0
votes
0answers
19 views

Nested similar route in vue-router not rendering deep level components

I have a component that renders a list of buttons from the children of a route. <template> <div v-if="childrenRoute.length" class="buttons"> // render buttons </div> ...
1
vote
2answers
36 views

Vue-router push to Named View

I can't find solution to go to named view. My routes , routes: [ { path: '/', component: App, children : [ { path: '/', redirect: 'home' }, { path: 'home', ...
0
votes
0answers
15 views

nuxt js page with keycloak js authentication middleware reloaded twice when browser window refreshed?nuxtjs router not waiting until promises resolves

I am using keycloak for authentication with following code in nuxt js middleware: import Keycloak from 'keycloak-js' const keycloak = new Keycloak({ url: 'http://localhost:8080/auth', realm: '...
-1
votes
0answers
20 views

How to create twitter like modal using NUXT.JS router

I want to create modal with dynamic route like twitter. I am new to nuxtjs. Something like this. Please guide me in this. Thanks
0
votes
1answer
16 views

Enable (console) logging of router events in Vue

Somewhere in my Vue and Vuex application I suspect a (Vue) router push is triggered. To debug this I would like to enable logging of some sort, see all routing events pass by in my console. How can I ...
0
votes
1answer
22 views

Vuex not working with different components

I have this structure for a Vue app: App.vue -> Router View(with two child components) App.vue <template> <div id="app" @click="mutateStore(null)"> <router-view @...
0
votes
2answers
31 views

$router.push refreshing the page and losing data

I have a function that calls. editTrade: function(tradeData) { //include index and/or get object from store //forward through router. this.$router.push({name: '/trading/newTrade', ...
1
vote
1answer
35 views

How to reuse a named view with a nested nested route in Vue?

I have searched in lots of parts of Internet (stackoverflow,vue documentation, blogs, etc.) and I haven´t found the solution that I need. So, the issue is the following: routes.js { path:'/', ...
1
vote
2answers
19 views

RegEx - match substrings starting with a colon

I am struggling for hours now to find a working regex. I have this vue routes with dynamic segments and I need a regex to match those dynamic segments that starts with a colon. I know how to match ...
0
votes
1answer
26 views

Vuex(store js) doesn't update the computed property only if I refresh the page

Hi I am making a get call in store js and I pass it as computed property in Movie.vue, when I refresh the page I get the real value if I change the view or I go back to the index the value will not ...
0
votes
0answers
40 views

Does VueJS provide some kind of redirect parameter whitelistening?

I have been using this code, it has working so far, but i'm a bit worried about the security aspect (like hacking redirect with example.com inside redirect query) of it, is it safe by default in VueJS?...
0
votes
1answer
27 views

Call Two Methods on Watch Function in VueJs

I need to call functions "getService" and "getTabs" on watch method. The problem is the other one gets called but the other one doesn't when i decided to change $route. Is there a problem in my code? ...
0
votes
2answers
24 views

Not getting Data on update of link in Vue and Vuex

Can someone please tell me how can I update the data on getting the id from url. Like this I have a sidebar having some categories. category 1, category2, link on category1 and category 2 is ...
1
vote
1answer
40 views

Vue.js - DOM element not removed from parent component after route change in

I'm facing a consistent behavior in vue.js and could not find any documentation describing it, and what I would like to know is if this behavior is expected or not. I'm developing an SPA using vue.js ...
0
votes
0answers
34 views

Why can't I change document.title in vue-router?

I am trying to change document.title in vue-router, below is my code: router.beforeEach((to, from, next) => { if (to.meta.title) { document.title = to.meta.title } next() }) ...
0
votes
1answer
20 views

How can i return 404 error without change url in Vue?

Question Using Vue.js, how can i return 404 error in dynamic route without change url? Part of my route.js (everything ok) { path: '/work/:id', name: 'work', component: () => ...
0
votes
1answer
31 views

Vue Router meta fields

I was wondering if its possible to define custom properties when passing routes to VueRouter. For example for the majority of routes in my app I would like to define a route such as the following ...
0
votes
1answer
17 views

Vuex display error message(and unset) on navigation guard redirect

In my Vue Router I use a global navigation guard to check if a query String is required(to.meta.query) for the requested route - if none is provided or if it's value is null, redirect to parent ...
0
votes
0answers
34 views

VueJS - How can call function when transition page on App.vue

i try to make animation when i change transition page, my App.Vue is like this : <transition name="test" v-on:before-leave="leave" v-on:leave="leave" v-on:after-leave="leave" v-...
1
vote
0answers
24 views

Load different page template for mobile in nuxt

I'm working on a larger project and need to create a separate UX for mobile users on some pages. Using a responsive layout with CSS won't cut it, and dynamic component rendering with v-if results in a ...
0
votes
3answers
22 views

How to get this child component to render with view router in vue.js?

When a user logs in they are directed to LoggedIn.vue This component has a child component called TasksActions.vue which I also want to render. I get no errors but the child, TasksActions.vue does ...
2
votes
2answers
34 views

How to go to a child route by route name?

I know we can go to a route by its name using $router.push({ name: 'route-name' }). What I want to know is how to do that with a child route name. This is my route structure: export default [ { ...
0
votes
1answer
81 views

Very strange problem with vuetify datatable / props is not defined

I am using version 1.5.6 of Vuetify (upset on a Laravel 5.8 backend and VueJs 2.5.17) and put one of the DatatableComponent examples (https://vuetifyjs.com/en/components/data-tables) from the ...
0
votes
2answers
33 views

Vue Js Axios get method

I use vue.js and I try to set a parameter id in axios.get request and I can't understand how exactly to do it import Vue from 'vue' import Router from 'vue-router' import Home from './views/Home....
0
votes
2answers
50 views

Vue JS: How to style the active <a> tag in a router-link?

I'm trying to edit my router-link so that the color of the text as well as the background changes when the link is active. With the router-link-exact-active class, I've set it so the background ...
0
votes
0answers
24 views

Can't load nor refresh routes with dynamic id's

My Dynamic Matching Route is not working on load nor refresh. I know the problem has been adressed many times, I still don't find a fixing answer. I have implemented dynamic matching route following ...
0
votes
2answers
42 views

How could I get and set values with Vuex?

I'm new at Vue and this is the first time that I use Vuex, so this could be a completly misunderstanding of my part. I have a page that have 2 DatePicker, when the user select the values, the page ...
2
votes
2answers
54 views

How to fetch GET request variables with Vue (Router) before loading / displaying the page

When loading the login page - I want to check if there were GET variables set, and fetch them in my Vue app (So then I can change the mode displayed). My URL and variables look like this: https:/...

http://mssss.yulina-kosm.ru