My goal is to populate the array selectedParks
with the value of each item. However, I am facing an issue where the value is always set to the string "item" instead of the actual value of the Park Object.
Here is the code snippet:
<ul class="list-group no-bullets">
<li class="list-group-item" v-for="item in parks">
<label><input type="checkbox" value="item" v-model="selectedParks"/> {{item.name}}</label>
</li>
</ul>
<span>Checked: {{selectedParks}}</span>
I have confirmed that the item
itself is correctly bound as {{item.name}}
displays the correct value.
For more information on binding multiple checkboxes to the same array, you can check out the following documentation: https://v2.vuejs.org/v2/guide/forms.html