Returns undefined when finding an item in an array in VUE

Question

I have the code below that finds the item details in array which works well.

var findGroupId = medias.find(medias => medias.group_name === this.groupName)

My medias is an array variable. Then the result of console.log(findGroupId) is below:

But when I do console.log(findGroupId.group_id) the result is undefined. But when I try changing the demo here under Using ES2015 arrow function and do demo on JavaScript Demo: Array.find(), it works well. Am I missing something?

Sample array output (fetched from database): PS: trying not to use for loop to save some memory and time.

@Eddie Please see update, tried just using fixed array values, and works. but when I used the database from database, it's not working anymore. Maybe I think it's because of my array result format? — , Jun 07 '18 at 05:08
maybe try to `"console.log(Object.keys(findGroupId))"` and check if the the key is `group_id` without any spaces. — Crackers, Jun 07 '18 at 05:10
But logging `findGroupId` still gives you the output of your first screenshot? — Crackers, Jun 07 '18 at 05:14
So basically it does not work in fat arrow function? @ramedju — Eddie, Jun 07 '18 at 05:41
Using `this` on arrow function may not be the same with `this` on *regular* function. You might want to check on that. — Eddie, Jun 07 '18 at 05:42
https://stackoverflow.com/questions/38589227/why-this-is-undefined-inside-a-fat-arrow-function-definition — Eddie, Jun 07 '18 at 05:45
You might wanna read this one. Im not sure if that is the same issue though — Eddie, Jun 07 '18 at 05:45
@Eddie Seems that they're a bit different, coz it seems they're not using an array, am I right? — , Jun 07 '18 at 05:47
@ramedju I added an answer. Im not exactly sure if this solve your problem. Let me know how it goes. — Eddie, Jun 07 '18 at 05:49

score 1 · Accepted Answer · answered Jun 07 '18 at 05:48

1

this inside the arrow function might be referring to the document and not the object. One option is to store the this.groupName on a local variable and use it on your condition.

var groupName = this.groupName;
var findGroupId = medias.find(media => media.group_name === groupName);

answered Jun 07 '18 at 05:48

Eddie

26,593
6
36
58

There you go. That's it. Thanks :) – Jun 07 '18 at 05:52
1

Happy to help :) – Eddie Jun 07 '18 at 05:52

Returns undefined when finding an item in an array in VUE

1 Answers1