@@ -10,13 +10,13 @@ If you need an older version check the `v1` branch: `npm i -D vuexfire@v1`
10
10
1 . Using a CDN:
11
11
12
12
``` html
13
- <script src =" https://unpkg.com/vuexfire" ></script >
13
+ <script src =" https://unpkg.com/vuexfire@next " ></script >
14
14
```
15
15
16
16
2 . In module environments, e.g CommonJS:
17
17
18
18
``` bash
19
- npm install vue firebase vuexfire --save
19
+ npm install vue firebase vuexfire@next --save
20
20
```
21
21
22
22
## Usage
@@ -74,7 +74,7 @@ const Component = {
74
74
template: ' <div>{{ todos }}</div>' ,
75
75
computed: Vuex .mapState ([' todos' ]),
76
76
created () {
77
- this .$store .dispatch (' setTodosRef' , db .ref (' todos' ))
77
+ this .$store .dispatch (' setTodosRef' , db .collection (' todos' ))
78
78
}
79
79
}
80
80
```
@@ -89,10 +89,10 @@ support any of these browsers:
89
89
- Android < 5.0
90
90
91
91
You'll have to include a polyfill. You can
92
- use [ Benvie/WeakMap] ( https://github.com/Benvie/WeakMap )
92
+ use [ Benvie/WeakMap] ( https://github.com/Benvie/WeakMap ) .
93
93
94
94
You can find more information about ` WeakMap `
95
- support [ here] ( http://kangax.github.io/compat-table/es6/#test-WeakMap )
95
+ support [ here] ( http://kangax.github.io/compat-table/es6/#test-WeakMap ) .
96
96
97
97
## How does it work?
98
98
@@ -104,7 +104,7 @@ it works with modules too :+1:
104
104
105
105
## Examples
106
106
107
- You can check out the examples by opening the html files in your browser, or check [ this online Demo ] ( https://jsfiddle.net/posva/6w3ks04x/ )
107
+ You can check out a complete example in the ` /examples ` directory.
108
108
109
109
## API
110
110
@@ -113,32 +113,37 @@ You can check out the examples by opening the html files in your browser, or che
113
113
This object contains VuexFire internal mutations. They are all prefixed by
114
114
` vuexfire/ ` . This object must be added in the root Store mutations object.
115
115
116
- ### bindFirebaseRef(key, ref[ , options ] )
116
+ ### bindFirebaseRef(key, ref)
117
117
118
118
_ Only available inside of an enhanced action_
119
119
120
120
Binds a firebase reference to a property in the state. If there was already
121
121
another reference bound to the same property, it unbinds it first.
122
122
123
- #### options:
124
-
125
123
``` js
126
- {
127
- cancelCallback: Function , // Cancel callback passed to Firebase when listening for events
128
- readyCallback: Function , // Callback called once the data has been loaded. Useful for SSR
129
- errorCallback: Function , // Callback called when there is an error loading the data. Useful for SSR
130
- wait: Boolean , // (Arrays only) Should Vuexfire wait for the whole array to be populated. Defaults to true
131
- }
124
+ bindFirebaseRef (' todos' , ref)
132
125
```
133
126
134
- ` wait ` can be set to true every time. It's useful to do pagination and SSR.
127
+ Returns a promise which will resolve when the data is ready, or throw an error if something goes wrong:
128
+
129
+ ``` js
130
+ bindFirebaseRef (' todos' , ref).then (() => {
131
+ commit (' setTodosLoaded' , true )
132
+ }).catch ((err ) => {
133
+ console .log (err)
134
+ })
135
+ ```
135
136
136
137
### unbindFirebaseRef(key)
137
138
138
139
_ Only available inside of an enhanced action_
139
140
140
141
Unbinds a bound firebase reference to a given property in the state.
141
142
143
+ ``` js
144
+ unbindFirebaseRef (' todos' )
145
+ ```
146
+
142
147
## License
143
148
144
149
[ MIT] ( http://opensource.org/licenses/MIT )
0 commit comments