<template>
<div class="location-bar">
<p class="location-name" v-if="!$route.meta.bcDynamic"> {{ $route.meta.location }} </p>
<p class="location-name" v-if="$route.meta.bcDynamic"> {{ formattedValue }} </p>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
beforeCreate() {
this.$options.computed.value = function() {
if (this.$route.meta.bcGetter) {
console.log(this.$route.meta.bcGetter);
return this.$store.state.categories.getters[this.$route.meta.bcGetter]
} else {
return null
}
}
},
computed: {
formattedValue() {
console.log(this.value);
return this.$route.meta.bcText(this.value) }
},
watch: {
$route() { this.loadData() }
},
methods: {
loadData() {
this.$store.commit('setActiveCategory', {id: this.$route.params.categoryId})
}
}
}
</script>// getters
const getters = {
allCategories: state => state.all,
activeCategory: (state, {activeCategoryId}) => {
return state.all.find( (p) => p.id === activeCategoryId) || null
}
}currentLocation() {
$store.currentLocation = this.nameconst actions = {
getAllCategories ({ commit }) {
Vue.http.get('category')
.then(response => response.json())
.then(data => {
if (data) {
console.log(data);
const categories = data;
commit(types.RECEIVE_CATEGORIES, { categories })
}
})
}
}import HomePage from './pages/HomePage.vue';
import MenuPage from './pages/MenuPage.vue';
import CategoriesPage from './pages/CategoriesPage.vue';
import CategoryPage from './pages/CategoryPage.vue';
import CartPage from './pages/CartPage.vue';
import ProfilePage from './pages/ProfilePage.vue';
import RestourantsPage from './pages/RestourantsPage.vue';
import PromoPage from './pages/PromoPage.vue';
export const routes = [
//{ path: '/', component: HomePage },
{ path: '/menu', component: MenuPage, children: [
{ path: '', component: CategoriesPage, name: 'Меню', children: [
{ path: 'id', component: CategoryPage }
] }
] },
{ path: '/profile', component: ProfilePage, name: 'Профиль' },
{ path: '/cart', component: CartPage, name: 'Корзина' },
{ path: '/promo', component: PromoPage, name: 'Акции' },
{ path: '/restourants', component: RestourantsPage, name: 'Рестораны' }
];
он пытается получить категории когда еще не определен activeCategoryId
console.log(state.all.find( (p) => p.id === state.activeCategoryId));
выводит udefined