nhayder
67
1
Vue

passing id to getter function

Posted 3 days ago by nhayder

hi, i'm using vuex with laravel as backend for my app, ..

in vuex i have pages array containing all the pages on the website

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex, axios);

export const store = new Vuex.Store({

    state:{
        pages   : [], // this is the array
    
    },

    getters: {
       
       // this is the function that will filter the page by id, so how to pass the id to this funciton
       getPageSettings: (state) => (id) => {
            
            return state.pages.find(pages => pages.id === id)
            
        }
        
    }

the part im struggling with is that i need to allow the user to change page settings by passing page id to getter function above, In this way i can filter requested page among other pages and display it on proper form for the user to update.

So i have gone ahead and mapped the getter function in my update page component like this

  computed:{

    ...mapGetters(['getPageSettings']),

    },

i can get the getPageSettings on vueDevTools if i fixed the getter function like this.

    getters: {

       getPageSettings: (state) => (id) => {
            
            return state.pages.find(pages => pages.id === 5)
            
        }
        
    }

so my question is how can i pass the ID form the component to store getter function.

Any ideas, ...

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.