Вы не правильно используйте Геттер.
Геттер — это вычисляемое свойство.
Например
redBackgrounds: function (state) {
return state.backgrounds // В этот момент Vue записывает state.backgrounds в зависимости для redBackgrounds
.filter(b => b === 'red') // Вычисляется и возвращается результат
}
При использовании
$store.getters.redBackgrounds // <-- Это свойство
/*
Функция которую мы писали выше будет запущена только один раз.
Её результат будет кэширован.
Кэш сбросится только в случае если одна из зависимостей, в нашем случае это state.backgrounds, изменится.
Тогда наша функция-геттер запустится снова, пересчитает значение и оно снова кэшируется.
*/
В вашем же случае геттер выглядит так:
showBackgrounds: function () {
return function () {} // <-- нет никаких зависимостей.
}
Важно отметить, что функции могут возвращаться геттерами. Но вы должны понимать в каких ситуациях это применимо и как работают геттеры
