score:0
okay the entire thing started with that i got an error saying
typeerror: cannot read property 'fornavn' of null
this made no sense to me because when i console.log the whole thing fornavn (fistname in danish) was there
useeffect(() => {
authenticationservice.currentuser.subscribe(z => {
console.log(z)
setcurrentuser(z);
setname(z.fornavn)
});
}, [])
so i tried to get the response from the login function witch gave me even more problems the solution to my problem was however to set an if statement in the useeffect like so:
useeffect(() => {
authenticationservice.currentuser.subscribe(z => {
if(z === null){
setcurrentuser(null);
setname(null);
}else{
setcurrentuser(z);
setname(z.fornavn);
}
});
}, [currentuser])
and now it works..
score:0
it looks like you have the prop defined as firstname in the parent component, and firstname in the child component? if that's accurate, it would cause an error.
as a side note, the way you name your functions does not make it very obvious that they are in fact functions. i would name the function firstname something like handleupdatefirstname or onchangefirstname for example. or...better yet, just pass setname as a prop. you are essentially just redefining it here:
firstname={fornavn => setname(fornavn)}
i would look into using proptypes for your components - it will tell you if you have a missing or mislabeled prop.
edit: example of passing setstate as a prop:
const child = ({name, setname}) => (
<div>
<h1>edit name</h1>
<input value={name} onchange={e => setname(e.target.value)}/>
</div>
)
const parent = () => {
const [ name, setname ] = usestate('')
return (
<child name={name} setname={setname}/>
)
}
Source: stackoverflow.com
Related Query
- how to update data from child to parent using hooks at login from database
- How to update the correct state value in a parent component that gets its value from a child component using hooks in react?
- How to update data from child component to parent component using context api in react?
- How to reset child component from parent using React Context and Hooks
- update state of child component from parent component using react hooks
- How can i pass data from child component to parent component which in above second level by using function base in React?
- How can i pass data from parent to child using props
- How do I use react context API to pass data from parent component to child component when using react-router in the parent component in React.js?
- react (class based) : How can I update JSON object in parent component using setState after the object being passed in function from child to parent?
- How to send array of objects data from child component to parent component and store in the parent object using react hooks?
- How to pass an Array from Child component to Parent component using hooks in react
- How to pass data from child component to its parent in ReactJS?
- How to prevent child component from re-rendering when using React hooks and memo?
- How to pass data from parent to child in react.js
- How do i pass data up from a child web component to it's direct parent element
- Ist there a way to pass data from child to parent using Hooks?
- Trigger child function from parent component using react hooks
- How to send data from stateless child component to stateless parent component in react?
- How to update parent state from child component in React + send a paramater
- How to make React.js fetch data from api as state and pass this state data from its parent to child component
- How do I get the Age data from child to parent component
- How do I correctly add data from multiple endpoints called inside useEffect to the state object using React Hooks and Context API?
- How to force update child component from parent component in reactjs
- How to trigger an event in Parent Component from Child Component onClick() using React Hooks?
- How to fix the state update in react while getting data from firestore database
- Data from Parent to child using props in ReactJs is not working properly
- React How to change state value from child to Parent using useState and useContext
- How do i update Auth0 lock logo from my React App using hooks
- How do I send data from child component to parent component in React
- How to update redux state using a react variable passed up to the component from a child
More Query from same tag
- How to use CSS inside a React + Material-UI project?
- Why I cant call useRouter hook inside getServerSideProps in next.js
- I am not being able to stop using componentWIllReceiveProps / getDerivedStateFromProps
- Creating an image map using Javascript, not an SVG (React)
- getValue() for SelectField
- Why isn't useContext updating my value when imported in ReactJS?
- Type for sending array of objects to child component so index [1] doesn't have to be specified
- Can't use JSPrintManager in reactjs
- Version JS files in react
- React Stateless Components: Interacting with their output and appearance
- setState doesn't update immediately, what is th best alternative way to do it?
- Axios.post then method doesn't run
- Semantic UI React - Table - Make whole row selectable and link somewhere
- how does the .render() function in react work internally?
- How to put a javascript function inside a React Class based component?
- Is it safe to share class instance in React Context API?
- React - Initialise state and access the state before first render
- How to use Leaflet Routing Machine with React-Leaflet 3?
- How to persist sign in until user log out on a react-redux app?
- Ant.design does not detect custom input component in Form.Item React
- NextJS not showing content from static json file
- How to get full control styling for data table from DevExtreme React Grid with material-ui?
- Remove Readonly when it is clicked outside of the input in React
- Lodash to sort data in react
- How to emit multiple actions in one epic using redux-observable?
- Warning: Component(...): No `render` method found on the returned component instance: you may have forgotten to define `render`
- React-bootstrap setup for latest kriasoft/react-starter-kit
- Integrate firebase push notification - React Js web App
- How to get object key from the api call dynamically and change the payload structure format?
- How to change styled-component styles by clicking on component with help of useState hook?