The problem in my vuex store index.js:
I want to filter an array with another array. If I access the filter function in its object I get an:
TypeError: Cannot read properties of undefined (reading 'includes')
at aspect_ratio (index.js?9101:72:1)
I have all my filter functions in an object like this:
export const filter_functions = {
form_factor_landscape: (obj) => {
return obj["Form Factor"] === "Landscape";
},
form_factor_portrait: (obj) => {
return obj["Form Factor"] === "Portrait";
},
aspect_ratio: (obj) => state.current_features.includes(obj["Aspect Ratio"]),
};
In my getters I want to access the aspect_ratio filter like this:
export const getters = {
filtered_items(state) {
const filteredArray = [...state.allHandhelds].filter(
filter_functions[state.current_sort]
);
return filteredArray.filter(filter_functions.aspect_ratio);
}
},
};
my state is like this:
export const state = () => ({
current_sort: "all_handhelds",
current_features: ["a", "b", "c"],
allHandhelds: [],
});
My thoughts:
It seems like there is some problem with accessing the object with the filter functions. Or more precisely accessing the current_features array from the state.
Strangely if I just take the filter function outside the object and directly embedd it everything works. Like this:
return filteredArray.filter((obj) => state.current_features.includes(obj["Aspect Ratio"]));
Any idea what I’m doing wrong?