Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

v-if function returning nothing, but it should

Running into an issue that’s been bugging me for the past 2 hours.

I’ve got a function in a mixin like so:

 checkPermissionMeetings(type,areaID){
            if(this.$store.state.global.permissions.meetings===true) { //If user has basic meeting access
                if(type==='write'){
                    Object.entries(this.$store.state.global.permissions.meeting_areas).forEach(([key, val]) => {
                        if (parseInt(key) === parseInt(areaID) && (val === 'write')) {
                            console.log('write_true')
                            return true;
                        }
                    });
                }
                if(type==='read'){
                    Object.entries(this.$store.state.global.permissions.meeting_areas).forEach(([key, val]) => {
                        if (parseInt(key) === parseInt(areaID) && (val === 'read' || val === 'write')) {
                            console.log('read_true')
                            return true;
                        }
                    });
                }
            }
        },

I am calling it in a view component which renders a navigation bar:

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

<span v-for="area in area_meetings">
                        {{area.id}} {{$store.state.global.permissions.meeting_areas[area.id]}} //This is here so I can see that I am sending the correct values to the function
                        {{checkPermissionMeetings('read', area.id)}} //This is here so I can see the output, but it returns nothing
                        <router-link tag="v-list-item" link :to="'/meetings/'+area.id" class="ml-5" v-if="checkPermissionMeetings('read', area.id)">
                            <v-list-item-icon>
                                <v-icon>mdi-chair-rolling</v-icon>
                            </v-list-item-icon>
                            <v-list-item-title>{{area.name}}</v-list-item-title>
                        </router-link>
                    </span>

I’ve console logged the outputs as you can see in the code, and they are looking ok. I have also put the function in curly braces so I can see the return, but this returns nothing at all.

This is an image

I can see them in my store

This is an image

I’m even echoing them out on the render and the values match…

This is an image

Is there something fundamental I’m missing here?

>Solution :

Because your return into forEach method, your main function doesn’t return anything. You can try to save in some variable returned data and after if statements return it. Or more easy way it use another loop like for of

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading