score:0
solved following: https://javebratt.com/firebase-user-undefined/
made asynchronous call because the uid was null for a few moment before fetching data, and error was triggered. just had to wait for data to load before error went off. also am grabbing the uid a new way via fire.auth().currentuser.uid
.
code i changed in settings.js:
componentdidmount(){
// asynchronous call fixes uid being null on reload
fire.auth().onauthstatechanged( user => {
if (user) {
fire.database().ref('/users/' + fire.auth().currentuser.uid).once('value').then(function(snapshot) {
this.setstate({
userfirstname: (snapshot.val().userfirstname),
userlastname: (snapshot.val().userlastname),
useremail: (snapshot.val().useremail),
userphone: (snapshot.val().userphone),
useraddress: (snapshot.val().useraddress),
userzip: (snapshot.val().userzip),
userprofilepicurl: (snapshot.val().userprofilepicurl)
})
}.bind(this));
}
});
score:2
you should call your firebase connection in componentdidmount
, but not in the constructor. you can read the details when to use react lifecycles. even though it is out of date (not react 16 article), it is a a great resource. https://engineering.musefind.com/react-lifecycle-methods-how-and-when-to-use-them-2111a1b692b1
class app extends react.component {
constructor() {}
componentdidmount() {
// firebase call
// do setstate
}
render() {
return <div></div>
}
}
Source: stackoverflow.com
Related Query
- Component loses data from states on reload
- How to pass data from child component to its parent in ReactJS?
- React Hook : Send data from child to parent component
- Is there a right way to pass data into a React component from the HTML page?
- React doesn't reload component data on route param change or query change
- How can I prevent a component from rendering before data is loaded?
- React - load all data from json into component
- passing data from child to parent component - react - via callback function
- Laravel 5.5 render a React component in a blade view with data from the controller
- Importing data from excel and displaying in a react component
- Getting data from TableRow component in Material UI
- React | pass data from parent to child component
- How to pass data from React Form -> Flask Backend -> React Component (does it have something to do with CORS)?
- How do i pass data up from a child web component to it's direct parent element
- How can I use react useContext , to show data from context, in the same component
- React Context : Get Data from API and call API whenever some events happens in React Component
- How to pass data from one component to another in React or React-Redux?
- React: passing mapped data from button onclick to display on another component
- Accessing the data from one component to another component
- How to pass data from one component to another ReactJS
- Generating groupings within a Material UI Select component dynamically from data
- How to pass data from one component to another while using API in reactjs
- Passing API data from parent container to child component in React
- Sending data from a form to the parent component in ReactJS
- React: get child component data from parent
- How to send data from stateless child component to stateless parent component in react?
- Passing data from rails controller to react component
- React JS access states / props from another component
- Display data in a React component from an object where the keys are different but the values are the same
- How to make React.js fetch data from api as state and pass this state data from its parent to child component
More Query from same tag
- What is preventing my redux actions from working properly?
- Persistence with localStorage with useState and useContext React Hooks
- How can I handle the state of a props in the correct method here? It doesn't update
- React router, props gone after page reload
- Enable button based on map value React
- react-i18next fallback backend combination issue
- In React, how to restrict the number of children with Typescript?
- Clear useContext state on logout
- Change html attribute value does not have data with onclick event using react
- TypeScript intersection types
- Setting Control's Value in Another Control's onChange Handler in React Bootstrap
- Showing sub array data acccording to main array ID
- React UseEffect setState doesn't re-render
- onClick change state of child component ReactJS
- Unable to setState on ReactJS component from outside React
- React-router V-5.2.0 is not working when navigating away from homepage
- Matching url params in Ionic with React
- Deployment of react app with express server gives blank screen but the app works fine with serve -s build
- How to refer to a DOM element inside a child component? [ReactJS]
- Issue Cycling through Array
- React.js: Set Prop only when condition is true
- input onChange not updating state in jest and enzyme
- Stop click event from propagating on popover target
- Simple routing on the page. How do I set up the correct display?
- Style React component to appear in the middle of semantic-ui grid column
- Unable to obtain children in jest + enzyme react test
- "TypeError: Cannot read property 'name' of undefined" when looping on JSON
- How to redirect a page to menu on reload or refresh page with react?
- How to manipulate state of parent component from child in react
- Formik Field Array for Nested fields