Mr.Richway Mr.Richway - 11 months ago 58
Javascript Question

Vue.js - Getting data from multiple keys in an object

I'm trying to set something up in my app where I can select an option from a list and change the background of the app depending on what's selected.

Let's say I have a list like:

<li v-for="item in items">
<label class="radio">
<input type="radio" value="{{ }}" v-model="itemSelection">
{{ }}

is an array that's stored in my

items: [
{name: 'item1', img: ''}
{name: 'item2', img: ''}
{name: 'item3', img: ''}

So when you select
I want to not only pull the name from the selection (which gets passed up to the parent component in
to display there) but also the img link to place that in css to change the background of the body. I'm not entirely sure how to go about this, as I'm pretty new to vue and this is basically something I'm building to help me learn!


Answer Source

You can do this by several ways e.g:

watch : {
    itemSelection: function(val) { ... }

There is some examples. Check this fiddle