Estoy intentando agregar un elemento a una matriz existente en Firebase. Estoy usando reaccionar. He visto otras menciones de este problema aquí y la solución siempre es exactamente lo que ya estoy haciendo, por lo que agradecería mucho la ayuda. Esto solo necesita actualizarse si el usuario selecciona un equipo al que unirse y he comprobado que los equipos son veraces
Configuración de mi base de fuego:
import firebase from 'firebase/app'
import 'firebase/functions'
import 'firebase/firestore'
import 'firebase/auth'
import 'firebase/storage'
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: process.env.REACT_APP_API_KEY,
authDomain: process.env.REACT_APP_AUTH_DOMAIN,
databaseURL: process.env.REACT_APP_DATABASE_URL,
projectId: process.env.REACT_APP_PROJECT_ID,
storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_MESSAGE_SENDER_ID,
appId: process.env.REACT_APP_ID,
measurementId: process.env.REACT_APP_MEASUREMENT_ID
};
const firebaseApp = firebase.initializeApp(firebaseConfig)
const db = firebaseApp.firestore()
const auth = firebaseApp.auth()
const storage = firebaseApp.storage()
// const provider = new firebase.auth.GoogleAuthProvider()
export { db, storage, auth }
mi función:
import { db, storage } from '../../firebase'
...
...
...
if(teams) {
db.collection('teams').doc(team.id).update({
teamMembers: db.FieldValue.arrayUnion(currentUser.id)
})
}
El error:
Uncaught (in promise) TypeError: Cannot read property 'arrayUnion' of undefined
at userInfoFirebase (SecondStep.js:179)
at submitFinalData (SecondStep.js:200)
at handleSubmit (SecondStep.js:281)
at HTMLUnknownElement.callCallback (react-dom.development.js:3945)
at Object.invokeGuardedCallbackDev (react-dom.development.js:3994)
at invokeGuardedCallback (react-dom.development.js:4056)
at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4070)
at executeDispatch (react-dom.development.js:8243)
at processDispatchQueueItemsInOrder (react-dom.development.js:8275)
at processDispatchQueue (react-dom.development.js:8288)
at dispatchEventsForPlugins (react-dom.development.js:8299)
at react-dom.development.js:8508
at batchedEventUpdates (react-dom.development.js:22396)
at batchedEventUpdates (react-dom.development.js:3745)
at dispatchEventForPluginEventSystem (react-dom.development.js:8507)
at attemptToDispatchEvent (react-dom.development.js:6005)
at dispatchEvent (react-dom.development.js:5924)
at unstable_runWithPriority (scheduler.development.js:646)
at runWithPriority (react-dom.development.js:11276)
at discreteUpdates (react-dom.development.js:22413)
at discreteUpdates (react-dom.development.js:3756)
at dispatchDiscreteEvent (react-dom.development.js:5889)
Nunca he usado Firebase con React, pero creo que deberías usar firebase.firestore.FieldValue.arrayUnion(currentUser.id) en lugar de db.FieldValue.arrayUnion(currentUser.id)?
– Rosário Pereira Fernandes
27/03/2021 a las 18:52
db = firebase.firestore() así es como lo configuré en el archivo firebase.
-Bryant Richards
27/03/2021 a las 19:06
2
Eso es incorrecto, Bryant. Su base de datos = firebase.firestore(), pero FieldValue está definido en firebase.firestore (sin ()).
- Frank van Puffelen
27/03/2021 a las 19:37
------------------------------------
Su base de datos = firebase.firestore(), pero FieldValue está definido en firebase.firestore (sin ()).
También necesitarás exportar el espacio de nombres de Firebase con:
export { firebase, db, storage, auth }
Importarlo con:
import { firebase, db, storage } from '../../firebase'
Y luego úsalo con:
teamMembers: firebase.firestore.FieldValue.arrayUnion(currentUser.id)
Como alternativa, puedes exportar arrayUnion o FieldValue y usarlos.
2
¡Gracias! Desearía que eso fuera más claro en los documentos. Hasta ahora, cada vez que me encuentro con esa estructura, puedo acortarla como lo intenté aquí. ¡Tu solución funcionó!
-Bryant Richards
27/03/2021 a las 21:23
Gracias. Tuve este problema y perdí mucho tiempo con otras respuestas y finalmente funcionó después de quitarme esos frenillos. He estado probando el resultado de búsqueda de Google.soluciones y esta respuesta no apareció como resultado, la encontré en otro sitio web.
- Rifat
6 de abril de 2021 a las 5:57
------------------------------------
Importar arrayUnion desde Fire Store:
import { arrayUnion} from "firebase/firestore";
y luego usa esto:
lessons: arrayUnion("greater_virginia2")
Respondido
11 de enero de 2022 a las 18:32
Malik Faizan
Malik Faizan
13
3
3 insignias de bronce
1
Esta es la respuesta funcional a partir de Firebase 9.15.0. Tenga en cuenta que la función actualizada ya no permite matrices anidadas.
- Jeremy Gordon
21 de diciembre de 2022 a las 2:51