What is this syntax `${k}` in vuejs's property?

Question

For example:

<v-checkbox v-for="(v,k) in questionContent.choices" :key="k"
    v-model="answerData[question.id]" @change="saveAnswer(qe.id, question.id)"
    :label="`${k}. ${v}`"
    :value="k"
    hide-details
/>

What is the name of this `${k}. ${v}` feature ?

It isn't a Vue feature, it's core JavaScript. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals — skirtle, Aug 16 '19 at 14:39
Possible duplicate of [What does ${} (dollar sign and curly braces) mean in a string in Javascript?](https://stackoverflow.com/questions/35835362/what-does-dollar-sign-and-curly-braces-mean-in-a-string-in-javascript) — str, Aug 16 '19 at 14:55

score 2 · Accepted Answer · answered Aug 16 '19 at 14:47

2

It just binds a string to the label attribute. In es6 instead of k + ". " + v you can do ${k}. ${v} to concatenate a string. In order to use the "feature" the string must be in backticks instead of single or double quotes.

answered Aug 16 '19 at 14:47

SuperDJ

7,108
9
38
68

And, the feature's name is `template literal`. – Eric Aug 16 '19 at 18:50
1

Can you tell me what the advantage is? It seems like you need more symbols to concatenate this way. – silversunhunter Nov 03 '21 at 19:40

What is this syntax `${k}` in vuejs's property?

1 Answers1