I need to access methods of the parent component from within the current one, without using props.
Below is the structure in HTML:
<div id="el">
<user v-for="user in users" :item="user"></user>
</div>
And here is the Vue code snippet:
var usersData = [
{ id:1, firstname:'John', lastname: 'Doe' },
{ id:2, firstname:'Martin', lastname: 'Bust' }
];
var vm = new Vue({
el: '#el',
data: { users: usersData },
methods: {
getFullName: function (user) {
return user.id + '. ' + user.firstname + ' ' + user.lastname;
}
},
components: {
user: {
template: '<span>{{ fullName }}</span>',
props: ['item'],
computed: {
fullName: function(){
return this.$parent.getFullName(this.item);
}
},
}
}
});
This specific VueJS version being used is 2.0.2.
Attempts like
this.$parent.$options.methods.getFullName()
and this.$parent.methods.getFullName()
have not been successful in accessing the desired method.