Use Template Literals with router-link to Create Dynamic Routes in Vue 3
Template literals give you a convenient way to handle routing with dynamic data. In this lesson, we use a template literal on router-link's :to property.
Instructor: [0:00] I want to be able to click on each of these crafts, and go to a page which is just for those. That would be /craft/ID. Let's go to our component. We're going to change our P tag to be our router link. We want to bind our router links to value to template literal, that is craft/craft/ and then this current-crafts ID.
[0:25] Now if we go back to our application, we can see these have all turned into links. If we click on them, we can see the ID is appearing in the URL, and it's appearing back there. The styling's a bit off, so let me just fix that. I'll take anchor tags and I'll say, text-decoration, it's what's controlling the underline, I'm going to say, none. We know underline's nine, and I'll set color back to black again.