score:4
there is a little miss use of life-cycle hooks there.
you should be giving initial value to state
on class constructor.
e.g.
class example extends react.component {
constructor(props){
super(props)
this.state = {
name: this.props.cookies.get('name') || 'ben',
}
}
...
or if you use newer es7 syntax just
class example extends react.component {
state = {
name: this.props.cookies.get('name') || 'ben',
}
...
constructor
-function is not required on lower example
componentwillmount
life-cycle will also be deprecated in upcoming react releases so i would recommend to avoid using it.
replacement for it is accordingly
static getderivedstatefromprops(nextprops, prevstate){
return {username: nextprops.username}
}
see difference here, we return normal object
which then get's passed to components state. so in here username
would be get passed to state
.
Source: stackoverflow.com
Related Query
- How do I get cookies in react js using react-cookie?
- How do I get an attribute of an element nested in a React component using Jest and/or Enzyme?
- How to get parent width/height in React using Hooks?
- How to get country code and Country name using IP in react js
- Trying to get then send a cookie using react and fetch
- How to get width of element using React ref?
- How to get a React Component reference to change its class using classList?
- How to get the changed state after an async action, using React functional hooks
- How to get the element with the testid using react testing library?
- How do I access data returned from an axios get to display on a web page using react js?
- how get context react using django
- How to properly make a GET call in React returning an observable (resembling the method in Angular and not using promises)?
- How to get contacts from phone using react native expo
- How to get JWT cookies in our react application, how to check the user is login or not I am unable to find how to handle my react application session
- How to get a data after react select using axios and ReactJS?
- How can i get the location of the user - Using at React Map GL
- I can not get the state from react router Link component using useLocation. So how can I pass it?
- React TypeScript: How to get form values, and response codes using fetch
- How to get the time in seconds after click on submit button using React Count Down Timer
- how to get params using react router dom v5.0.1
- How do I get my HTML form date input to only allow specific days of the week to be chosen using JavaScript, React and HTML?
- How to get the value of the span element with testid using react testing library?
- How to get Position of Components using React Function Components
- How can I get data from query string using route in react js
- How to Assign react redux state api get data using axios
- How to get accumulated price in a nested array using reduce in React
- How to get index of the clicked images which is an item of array using React native
- How to get data from table row click using Semantic's React Table Component
- How do I get the debugger to recognize the sourcemaps in webstorm 10 using the react starter kit
- How to get Chrome to respond to Windows 10 high contrast mode using javascript/typescript in a React app
More Query from same tag
- ReactJS PropType to check values of associative arrays
- Unhandled Rejection (Error): Given action returned undefined React JS
- SurveyJs Input element with addon
- Issue with a button that creates inputs in a form
- TypeError: Cannot read property 'map' of undefined brings down in the entire system
- Use state or refs in React.js form components?
- How to test redux saga using jest and enzyme
- how to remove listener on cleanup function
- Is there a way to detect when data used by a query is evicted from the Apollo Client cache?
- pass props into another component in react js
- docker containers on different ports work differently with the same configuration
- Putting label array to the chartjs?
- Call load() from react-howler
- How to style multiple variations of a <button> with Styled Components
- eg - Component rerenders after input value is changed ? How to correct it
- Method not updating state when called in componentDidMount()
- Call method from parent to child via component
- React , Redux and Firebase storage image fetching
- Simple Component is not rendering: React js
- How to use debounce with React
- Is it possible to re-mount a component in React?
- Export array ReactJS - error: array is read-only
- How to make an input field
- JS Object Update + React Reducer
- How can you show a modal in react when you press the back button browser?
- How to check if an id is already present in a firebase realtime database using react.js
- How can I fix CSS transitions on react?
- defining a function to pass it as props, but I get a compiling error
- this keyword value when using React event handlers
- React TypeScript: How to call an api and set state each time the route changes