File tree Expand file tree Collapse file tree 1 file changed +32
-4
lines changed Expand file tree Collapse file tree 1 file changed +32
-4
lines changed Original file line number Diff line number Diff line change 1
1
# Introduction
2
2
3
3
This [ Vuex-ORM] ( https://github.com/vuex-orm/vuex-orm ) plugin uses the
4
- [ apollo-client] ( https://www.apollographql.com/client/ ) to let you sync your Vuex state with
4
+ [ apollo-client] ( https://www.apollographql.com/client/ ) to let you sync your Vuex-ORM database with your server via
5
5
a [ GraphQL API] ( http://graphql.org/ ) .
6
6
7
7
::: warning
8
8
This plugin is in BETA stage, please use with care.
9
9
:::
10
10
11
+ ::: warning
12
+ You should have basic knowledge of [ Vue] ( https://vuejs.org/ ) , [ Vuex] ( https://vuex.vuejs.org/ ) and
13
+ [ Vuex-ORM] ( https://vuex-orm.github.io/vuex-orm/ ) before reading this documentation.
14
+ :::
15
+
16
+
17
+ ---
18
+
11
19
12
20
[[ toc]]
13
21
@@ -40,7 +48,11 @@ After [installing](/guide/setup) this plugin you can load data in your component
40
48
``` vue
41
49
<template>
42
50
<ul>
43
- <li v-for="user in users" :key="user.name">{{user.name}}</li>
51
+ <li v-for="user in users" :key="user.id">
52
+ {{user.name}}
53
+
54
+ <a href="#" @click.prevent="destroy(user)">x</a>
55
+ </li>
44
56
</ul>
45
57
</template>
46
58
@@ -50,11 +62,27 @@ After [installing](/guide/setup) this plugin you can load data in your component
50
62
51
63
export default {
52
64
computed: {
65
+ /**
66
+ * Returns all users with reactivity.
67
+ */
53
68
users: () => User.getters['all']()
54
69
},
55
70
56
- created() {
57
- User.dispatch('fetch');
71
+
72
+ async mounted() {
73
+ // Load all users form the server
74
+ await User.dispatch('fetch');
75
+ },
76
+
77
+
78
+ methods: {
79
+ /**
80
+ * Deletes the user from Vuex Store and from the server.
81
+ */
82
+ async destroy(user) {
83
+ User.dispatch('delete', user.id);
84
+ await User.dispatch('destroy', { id: user.id });
85
+ }
58
86
}
59
87
}
60
88
</script>
You can’t perform that action at this time.
0 commit comments