我正在尝试在Nuxt应用程序中将位置设置为Vuex存储。我已经研究过使用vuexfire,但是,我不确定这在SSR应用程序中是否最佳,或者通常是最简单的最佳实践。
如何从Firebase Firestore请求并设置状态(在此示例中为“位置”)?
最好在SSR应用程序中使用nuxtServerInit吗?
商店/index.js
import Vuex from 'vuex'
import firebase, {auth, db} from '@/services/firebaseinit.js'
const createStore = () => {
return new Vuex.Store({
state: {
user: null,
locations: [],
},
getters: {
// User
activeUser: (state) => {
return state.user
},
// Locations
loadedLocations(state) {
return state.loadedLocations
}
},
mutations: {
// User
setUser (state, payload) {
state.user = payload
},
// Locations
setLocations (state, locations) {
state.locations = locations
}
},
actions: {
// Locations
setLocations(vuexContext, locations) {
vuexContext.commit('setLocations', locations)
},
// Users
autoSignIn ({commit}, payload) {
commit('setUser', payload)
},
signInWithFacebook ({commit}) {
return new Promise((resolve, reject) => {
auth.signInWithPopup(new firebase.auth.FacebookAuthProvider())
resolve()
})
},
signOut ({commit}) {
auth.signOut().then(() => {
commit('setUser', null)
}).catch(error => console.log(error))
},
}
})
}