Skip to content

Commit 7f95aa6

Browse files
posvaposva
committed
✨ support Timestapms
Closes vuejs#161
1 parent e3bd484 commit 7f95aa6

File tree

4 files changed

+203
-192
lines changed

4 files changed

+203
-192
lines changed

‎packages/vuexfire/examples/TodoApp/index.html‎

Lines changed: 39 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,50 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8">
5-
<title>VuexFire Todo App Demo</title>
6-
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase.js"></script>
7-
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-firestore.js"></script>
8-
<script src="https://unpkg.com/vue/dist/vue.js"></script>
9-
<script src="https://unpkg.com/vuex/dist/vuex.js"></script>
10-
<script src="../../dist/vuexfire.js"></script>
11-
</head>
12-
<body>
133

14-
<!--
4+
<head>
5+
<meta charset="utf-8">
6+
<title>VuexFire Todo App Demo</title>
7+
<script src="https://www.gstatic.com/firebasejs/4.13.0/firebase.js"></script>
8+
<script src="https://www.gstatic.com/firebasejs/4.13.0/firebase-firestore.js"></script>
9+
<script src="https://unpkg.com/vue/dist/vue.js"></script>
10+
<script src="https://unpkg.com/vuex/dist/vuex.js"></script>
11+
<script src="../../dist/vuexfire.js"></script>
12+
</head>
13+
14+
<body>
15+
16+
<!--
1517
To see a live example, head to
1618
https://jsfiddle.net/posva/6w3ks04x/
1719
-->
1820

19-
<div id="app">
20-
<ul>
21-
<li v-for="item in items" :key="item.id">
22-
{{ item.text }}
23-
<button @click="removeTodo(item.id)">X</button>
24-
</li>
25-
</ul>
26-
<form @submit.prevent="addTodo">
27-
<input v-model="newTodo">
28-
<button>Add #{{ items.length }}</button>
29-
</form>
21+
<div id="app">
22+
<ul>
23+
<li v-for="item in items" :key="item.id">
24+
{{ item.text }}
25+
<button @click="removeTodo(item.id)">X</button>
26+
</li>
27+
</ul>
28+
<form @submit.prevent="addTodo">
29+
<input v-model="newTodo">
30+
<button>Add #{{ items.length }}</button>
31+
</form>
3032

31-
<br/>
32-
<br/>
33+
<br/>
34+
<br/>
3335

34-
<button @click="toggleSource">Toggle Source</button>
35-
</div>
36+
<button @click="toggleSource">Toggle Source</button>
37+
</div>
3638

37-
<script>
39+
<script>
3840
/* global Vue, Vuex, firebase, VuexFire */
3941
firebase.initializeApp({
4042
projectId: 'vue-fire-store',
4143
databaseURL: 'https://vue-fire-store.firebaseio.com'
4244
})
45+
4346
var db = firebase.firestore()
47+
db.settings({ timestampsInSnapshots: true })
4448
var itemsRef = db.collection('vuexfireItems1')
4549
var todosRef = db.collection('vuexfireItems2')
4650

@@ -63,36 +67,37 @@
6367
window.vm = new Vue({
6468
el: '#app',
6569
store: store,
66-
computed: Vuex.mapGetters([ 'items' ]),
70+
computed: Vuex.mapGetters(['items']),
6771
data: {
6872
newTodo: '',
6973
},
7074

7175
methods: {
72-
removeTodo (id) {
76+
removeTodo(id) {
7377
this.source.doc(id).delete()
7478
},
75-
addTodo () {
79+
addTodo() {
7680
if (this.newTodo.trim()) {
7781
this.source.add({
7882
text: this.newTodo,
7983
})
8084
this.newTodo = ''
8185
}
8286
},
83-
toggleSource () {
87+
toggleSource() {
8488
this.source = this.source === itemsRef
8589
? todosRef
8690
: itemsRef
8791
this.$store.dispatch('setItemsRef', this.source)
8892
},
8993
},
9094

91-
created () {
95+
created() {
9296
this.source = itemsRef
9397
this.$store.dispatch('setItemsRef', this.source)
9498
},
9599
})
96-
</script>
97-
</body>
100+
</script>
101+
</body>
102+
98103
</html>

‎packages/vuexfire/examples/TodoApp/modules.html‎

Lines changed: 32 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,40 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8">
5-
<title>VuexFire Todo App Demo</title>
6-
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase.js"></script>
7-
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-firestore.js"></script>
8-
<script src="https://unpkg.com/vue/dist/vue.js"></script>
9-
<script src="https://unpkg.com/vuex/dist/vuex.js"></script>
10-
<script src="../../dist/vuexfire.js"></script>
11-
</head>
12-
<body>
133

14-
<div id="app">
15-
<ul>
16-
<li v-for="item in items" :key="item.id">
17-
{{ item.text }}
18-
<button @click="removeTodo(item.id)">X</button>
19-
</li>
20-
</ul>
21-
<form @submit.prevent="addTodo">
22-
<input v-model="newTodo">
23-
<button>Add #{{ items.length }}</button>
24-
</form>
25-
</div>
4+
<head>
5+
<meta charset="utf-8">
6+
<title>VuexFire Todo App Demo</title>
7+
<script src="https://www.gstatic.com/firebasejs/4.13.0/firebase.js"></script>
8+
<script src="https://www.gstatic.com/firebasejs/4.13.0/firebase-firestore.js"></script>
9+
<script src="https://unpkg.com/vue/dist/vue.js"></script>
10+
<script src="https://unpkg.com/vuex/dist/vuex.js"></script>
11+
<script src="../../dist/vuexfire.js"></script>
12+
</head>
2613

27-
<script>
14+
<body>
15+
16+
<div id="app">
17+
<ul>
18+
<li v-for="item in items" :key="item.id">
19+
{{ item.text }}
20+
<button @click="removeTodo(item.id)">X</button>
21+
</li>
22+
</ul>
23+
<form @submit.prevent="addTodo">
24+
<input v-model="newTodo">
25+
<button>Add #{{ items.length }}</button>
26+
</form>
27+
</div>
28+
29+
<script>
2830
/* global Vue, Vuex, firebase, VuexFire */
2931
firebase.initializeApp({
3032
projectId: 'vue-fire-store',
3133
databaseURL: 'https://vue-fire-store.firebaseio.com'
3234
})
35+
3336
var db = firebase.firestore()
37+
db.settings({ timestampsInSnapshots: true })
3438
var itemsRef = db.collection('vuexfireItems1')
3539

3640
var todos = {
@@ -54,7 +58,7 @@
5458
window.vm = new Vue({
5559
el: '#app',
5660
store: store,
57-
computed: Vuex.mapGetters([ 'items' ]),
61+
computed: Vuex.mapGetters(['items']),
5862
data: {
5963
newTodo: '',
6064
},
@@ -73,10 +77,11 @@
7377
},
7478
},
7579

76-
created () {
80+
created() {
7781
this.$store.dispatch('setItemsRef', itemsRef)
7882
},
7983
})
80-
</script>
81-
</body>
84+
</script>
85+
</body>
86+
8287
</html>

0 commit comments

Comments
 (0)