From the course: Learning Vue.js
Join today to access over 22,500 courses taught by industry experts or purchase this course individually.
Dynamic attributes and v-model - Vue.js Tutorial
From the course: Learning Vue.js
Dynamic attributes and v-model
- [Instructor] Next I want to take a quick look at how to bind data properties, to an elements attributes. Let's say that we wanted to add a link for more information down here. The link text will be read more and, it will point to the Vue guide. But if we want to our app to be a generic solution for any kind of flashcard deck, we would probably have our URL as part of the data, and we can just call it readMoreUrl and initialize it to that same value. All we have to do now, to use our data property in place of this hard-coded href value, is replace it with readMoreUrl, and change href to v-bind:href. So now if I refresh, I have a link down here, with a dynamic href value. One way to simplify your template or your markup, is just to remove the v-bind part, leaving only :href, this is just a shorthand version of the v-bind syntax, and it's usage is very common. In fact for the rest of the course we'll be using the…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.