change the event accordingly

This commit is contained in:
busti 2019-11-14 04:14:47 +01:00
parent 83e62f5958
commit fc113c2f3f
2 changed files with 19 additions and 7 deletions

View file

@ -7,7 +7,7 @@
</button>
<div class="dropdown-menu bg-dark" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item text-light" href="#" v-for="(event, index) in events" v-bind:key="index"
:class="{ active: event === activeEvent }">{{ event }}</a>
:class="{ active: event === activeEvent }" @click="changeEvent(event)">{{ event }}</a>
</div>
</div>
@ -38,7 +38,7 @@
</template>
<script>
import {mapState} from 'vuex';
import { mapState, mapActions } from 'vuex';
export default {
@ -52,10 +52,10 @@ export default {
]
}),
computed: {
...mapState({
events: state => state.events,
activeEvent: state => state.activeEvent
})
...mapState(['events', 'activeEvent'])
},
methods: {
...mapActions(['changeEvent'])
}
};
</script>

View file

@ -6,6 +6,18 @@ Vue.use(Vuex);
export default new Vuex.Store({
state: {
events: ['35c3', 'camp19', '36c3'],
activeEvent: '35c3'
activeEvent: '36c3',
loadedItems: []
},
mutations: {
changeEvent(state, event) {
state.activeEvent = event;
}
},
actions: {
changeEvent({ commit }, event) {
// todo: load items from server
commit('changeEvent', event);
}
}
});