Skip to content

Commit 1a5e9fe

Browse files
committed
lesson11-state&getters-finish
1 parent 62c3d49 commit 1a5e9fe

File tree

3 files changed

+48
-8
lines changed

3 files changed

+48
-8
lines changed

src/router.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,16 +14,16 @@ export default new Router({
1414
name: 'event-list',
1515
component: EventList
1616
},
17+
{
18+
path: '/event/create',
19+
name: 'event-create',
20+
component: EventCreate
21+
},
1722
{
1823
path: '/event/:id',
1924
name: 'event-show',
2025
component: EventShow,
2126
props: true
22-
},
23-
{
24-
path: '/event/create',
25-
name: 'event-create',
26-
component: EventCreate
2727
}
2828
]
2929
})

src/store.js

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,29 @@ import Vuex from 'vuex'
44
Vue.use(Vuex)
55

66
export default new Vuex.Store({
7-
state: {},
7+
state: {
8+
user: { id: 'abc123', name: 'Adam Jahr' },
9+
categories: [
10+
'sustainability',
11+
'nature',
12+
'animal welfare',
13+
'housing',
14+
'education',
15+
'food',
16+
'community'
17+
],
18+
events: [
19+
{ id: 1, title: '...', organizer: '...' },
20+
{ id: 2, title: '...', organizer: '...' },
21+
{ id: 3, title: '...', organizer: '...' },
22+
{ id: 4, title: '...', organizer: '...' }
23+
]
24+
},
825
mutations: {},
9-
actions: {}
26+
actions: {},
27+
getters: {
28+
getEventById: state => id => {
29+
return state.events.find(event => event.id === id)
30+
}
31+
}
1032
})

src/views/EventCreate.vue

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,21 @@
11
<template>
2-
<h1>Create Event</h1>
2+
<div>
3+
<h1>Create an Event, {{ user.name }}</h1>
4+
<p>This event was created by {{ user.name }}</p>
5+
<p>{{ getEventById(2) }}</p>
6+
</div>
37
</template>
8+
9+
<script>
10+
import { mapState, mapGetters } from 'vuex'
11+
12+
export default {
13+
computed: {
14+
...mapGetters(['getEventById']),
15+
...mapState(['user', 'categories'])
16+
}
17+
}
18+
</script>
19+
20+
<style scoped>
21+
</style>

0 commit comments

Comments
 (0)