In this lesson, we will learn how to iterate over an array in a Vue.js template using the v-for
property. We can add to and remove from that list using v-on:click
and v-on:keypress.enter
.
Using ref="itemForm"
insted of id="itemForm"
is more eficient
const input = this.$refs.itemForm
another aprouch is v-model
instead DOM manipulation.
v-model
or $refs
are both great ways to get the input field!
When iterating over the items list using the for property, shouldn't the order of the index and item be reverse? In the video we have: <li v-for="(index, item) in items">
but shouldn't it be <li v-for="(item, index) in items">
??
The optional second argument for v-for
is the index of the current item.
document.getElement instead of v-model? not cool.
I understand. In a later lesson we discuss the usefulness of v-model.
I was wondering why (index, item)
wasn't working for me and I noticed it was because the previous lesson was using V1 of Vue, which I copied from the example Plunkr, and I didn't realise this lesson had switched to V2.
Glad I looked at the Discussions. I was wondering the same and I think he rather flies through the material and really I can get this off the Docs. So your next thought would be why don't you then? Why I commit to a Tutorial site is so I can get a better explanation than the Docs usually give. There is no real explanation of anything.