How to pass query string in Vue.js

Question

I have following code in vue.js file

<p>{{match.tournament_name}}<p>

Above code will print tournament name inside p tag.

Now I want to pass match.tournament_name as query string for my a tag. But I am not sure how to do string interpolation in Vue.js. I have tried like this

<a href="/score_cards/new?tournament_name={{match.tournament_name}}">Upload Score Card</a>

But above string interpolation doesn't work. So How can I pass match.tournament_name as query string ?

ZloiGoroh · Accepted Answer · 2021-08-18 05:17:06Z

3

For that you can use v-bind attributes. For example:

<a v-bind:href="`/score_cards/new?tournament_name=${match.tournament_name}`">Upload Score Card</a>

Also you can use reduction :href instead of v-bind:href

answered Aug 18, 2021 at 5:17

ZloiGoroh

4655 silver badges15 bronze badges

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

Collectives™ on Stack Overflow

How to pass query string in Vue.js

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