score:0
the concept of that example is not about fetch , the example explains that even if you call two set states within a same function , the variables present in the set state are completely independent.but when the state is updated they are merge to a single update.
score:4
state update are merged means that when you update only one key in the object state it will not affect the other keys.
for example let's say your state is as followed:
this.state = { key1 : value1, key2 : value2 }
if you use this.setstate such as :
this.setstate({ key1 : value3 }
your new state will be :
this.state = { key1 : value3, key2 : value2 }
it has merged the update with the existing state, meaning it did not affect the key2. if state update would not be merged the new state would be
this.state = { key1 : value 3}
and key2 would not exist anymore in your state as it was not defined in your update.
the merging affects key/value pair which are not included in your update.
also it means that if you have different this.setstate({}) in the same function, all the update will be gathered together and the state update will happen only once.
in the example from the doc two different fetch functions are used because each of them has a different role, the first one is fetching posts, therefor the setstate update the posts (and do not affect the this.state.comments as "state update are merged") and the second one is fetching comments, updating the state with the new comments and not affecting the this.state.posts value.
edit: the response argument is the response you get from the function fetch, which is normally fetching data from a source (your database, an external api...)
Source: stackoverflow.com
Related Query
- What does "State Updates are Merged" mean in ReactJS?
- what does it mean "Legacy octal literals are not allowed in strict mode" in ReactJS?
- React cannot set state inside useEffect does not update state in the current cycle but updates state in the next cycle. What could be causing this?
- What does it mean 'Legacy octal literals are not allowed in strict mode in react js'?
- What does it mean when there are two functions with the 'arrow function indicator' between them?
- What does "Deprecated. Instead, use composability." mean in Reactjs Material-UI menuItems?
- What does it mean when they say React is XSS protected?
- What does ...rest mean in React JSX?
- What does the hook numbers in the Reactjs Dev tool correspond to?
- What does :: (double colon) mean in JavaScript?
- What does it mean to 'move this variable directly inside useEffect' in this error message?
- const App: () => React$Node = () => {...}: what does it mean this instruction?
- What are the differences when re-rendering after state was set with Hooks compared to the class-based approach?
- What are disadvantages to using immutable state in React?
- What does @format mean in new react native App.js?
- React Source code: What does it mean by "real internal dependencies"
- How does npm start work? What all processes are happening in the background?
- What does the @ symbol mean in a react import statement
- What does three dots do in ReactJS
- What does the symbol '&$checked' mean
- ReactJS - What is difference between component state and class variable?
- Why getDerivedStateFromProps does not allow to re-render with the state update? Not a problem for componentWillReceiveProps - ReactJS
- What does the isVisible property mean in intersectionObeserver API?
- What does the '@' mean in front of an import in React?
- What are the main differences between AngularJS and ReactJS
- What does "...this.props" mean in ReactJS?
- What does the className attribute mean in JSX?
- What does the question mark mean in the return statement in JS?
- const {name, value} = event.target -- what does this mean
- What does 'as' mean when importing a module?
More Query from same tag
- Jest + Enzyme testing error in mapStateToProps()
- TS: Deconstructing an array containing an object and a function (setter) only works with @ts-ignore
- Graph of a function of two variables (Threejs)
- Disable date input - MUI MobileDatepicker
- I get an Error from React: Maximum update depth exceeded
- Why does changing componentDidMount to non-arrow function make hot reloading work again?
- Getting the value of checkbox in Reactjs
- React use useEffect to load data asynchronously
- What happens for an useEffect with the second argument is null or undefined?
- How to change react Material-UI ToggleButton Color (for selected)
- How using types.d.ts file in React & TypeScript project
- Dynamic Form: TypeError: Cannot read property 'value' of undefined
- Get MIME type and extension from base64 string in Javascript
- I cannot use useSelector() on React/Redux
- Trying to fetch a specific record in JSON file
- Reactjs - TypeError: Cannot read property 'item' of undefined
- problems with storybook with Background parameters
- _reactDom2.default.render is not a function
- React - pass dynamic value to child
- How to create a large checklist page with React?
- Adding an object to the array React; "TypeError: Cannot read property 'push' of undefined"
- Uploading File doesn't let me pick same file after i remove it from selection
- Trouble finding element node using TestCafe Selector or testcafe-react-selector for nested components
- React map function - return one item at random
- React Beautiful DND not working, element is not draggable
- React's getDOMNode always return component's root DOM node instead of reffed one
- React-DOM: Unable to append Trading-view canvas from 'lightweight-charts' to body
- Wrapping a react-bootstrap component Typescript error
- How to prevent Default with typescript with reactjs
- How to implement floating labels on multiline TextField