How to add url query to a path in Vue.js router?

Question

This is how the route is used in template Component.vue:

<router-link :to="{ name: 'club' }">
  <lazy-image
    src="club.jpg"
    class="club_class"
    alt="Club alt"
  />
</router-link>

And this is how it's defined in router.js:

const routes = [
    {
        path: '/s/site',
        name: 'club',
        component: () => import('./_pages/Club'),
    },
];
export default routes;

I need to add a just a static parameter to the link like this:

'?foo=bar'

I tried to hardcode that in Component.vue but it didn't work. Shoud I define it in router.js as param or somewhere else?

:to="{ name: 'club', query:{ foo: 'bar' } }"

Lawrence Cherone
– Lawrence Cherone

2022-04-20 15:16:31 +00:00
Commented Apr 20, 2022 at 15:16 — Lawrence Cherone
– Lawrence Cherone, Commented Apr 20, 2022 at 15:16

Mojtaba · Accepted Answer · 2022-04-20 18:58:17Z

1

Use this code:

<router-link :to="{name: 'club', query: {param1: 'value1', param2: 'value2'}}">go</router-link>

answered Apr 20, 2022 at 18:58

Mojtaba

6552 gold badges9 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add url query to a path in Vue.js router?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related