Vuejs : rendering dynamic link in a button base on probs

Question

I have a create button above my table, I'm trying to render dynamic :to v-bind

Since I have access to {{title}}

Ex. {{title}} = apple, orange, any string

I've tried

<router-link :to=`${title}/create`>
    <v-btn color="blue white--text mt-5 mr-8">
        <span>Create</span>
    </v-btn>
</router-link>

I get

Try #2

to="{title}/create"

link redirect wrong!

http://localhost:8080/%7Btitle%7D/create

Try #3

to="{{title}}/create"

crashed !!

Bad Dobby · Accepted Answer · 2021-12-20 19:46:24Z

3

<router-link :to="`${title}/create`">
    <v-btn color="blue white--text mt-5 mr-8">
        <span>Create</span>
    </v-btn>
</router-link>

vue-directives are ALWAYS wrapped with double-quotes, even if you are using template literal

answered Dec 20, 2021 at 19:46

Bad Dobby

8912 gold badges9 silver badges25 bronze badges

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

Comments

Majed Badawi · Accepted Answer · 2021-12-20 19:46:46Z

2

Try this:

<router-link :to="`${title}/create`">

answered Dec 20, 2021 at 19:46

Majed Badawi

28.5k4 gold badges30 silver badges56 bronze badges