Just starting out with Vue and Element UI. I'm attempting to create a custom component using the ElementUI autocomplete/select feature.
The problem I am facing is that the @change method does not contain a event.target.value value.
When I try to access it, I receive the following error:
Error in v-on handler: "TypeError: Cannot read property 'value' of undefined"
Below is the code for my Vue component. It is being called using
<account-search v-model="newAccountForm.parent"></account-search>v-on:change.native="handleChange"<template>
<div>
<el-select :value="value" placeholder="Select" @change="handleChange">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</template>
<script>
export default {
name: "accountSearch",
props: {
value: {
type: String
}
},
data(){
return {
options:[
{
value: 1,
label: "hello"
},
{
value : 2,
label : "ola"
}
],
loading: false,
}
},
mounted() {
},
methods: {
handleChange: function (event) {
console.log(event.target.value);
// this.$emit('input', value);
},
}
}
</script>
<style scoped>
</style>
Any assistance would be greatly appreciated.