euvl/vue-js-toggle-button

The id is not in the object

Closed this issue · 1 comments

I run in a small problem when i have 2-3 toggle buttons with one event function, for example:

<ToggleButton id="id-1" @change="onChangeEventHandler" ></ToggleButton>
<ToggleButton id="id-2" @change="onChangeEventHandler" ></ToggleButton>
<ToggleButton id="id-3" @change="onChangeEventHandler" ></ToggleButton>

export default {
   methods:{
       onChangeEventHandler:function(e){
           //there is no ID in the object
           console.log(e)
       }
   }
}

The returned object from the change event does not return any id.
I had to call to parentElemnt to get the id of the toggle button.

onChangeEventHandler:function(e){
          this[e.srcEvent.target.parentElement.getAttribute('id')] = e.value;
}

Maybe it's me who did something wrong but i couldn't get the id.

euvl commented

id will not be there, id is html dom attribute.

what you want to do is to have your change look like @change="onChangeEvent(id)"