Event binding - Dan Abramov Conference talk

[Lizette]

https://youtu.be/dpw9EHDh2bM?t=1172

After watching the video, answer the following questions:

1. How do we store state in class-based components?
2. How do we store state in functional components?
3. What is the return value of a useState call?

[mayjer]

1. How do we store state in class-based components?

• State is stored as properties in the class variable this.state (can have multiple)
• The initial state can be set in the constructor by directly setting this.state
• Subsequent updates to state is done via the function this.setState()

2. How do we store state in functional components?

By declaring state variables with useState(name)

3. What is the return value of a useState call?

• useState() returns 2 variables the first is reference to the value (a getter?) and second a setter function for updating the value.
• need separate calls to useState for each property

[andersbraath1]

1. How do we store state in class-based components?

We use this.state and this.setState
2. How do we store state in functional components?
We can use useState() with hooks to make an before and after event
3. What is the return value of a useState call?
The return value is the current state after the change

[abuga]

1, How do we store state in class-based components?
we store the state variable in this.state object and we change it is by calling this.setState.
2, How do we store state in functional components?
we use react state hook to store the states.
3, What is the return value of a useState call?
It returns a pair of values: the current state and a function that updates it.

[andrewfleming]

1. How do we store state in class-based components?
State is stored as an object and we use this.state within class-based components.

2. How do we store state in functional components?
In functional components, we use hooks (ie useState) to store state.

3. What is the return value of a useState call?
The useState call returns the current state and a function which will update it.

[ibourn]

1. How do we store state in class-based components?
We store ‘state variable’ as a property of the object this.state and we change it with this.setState()

2. How do we store state in functional components?
By declaring it with
const [name, ... ] = useState('oldValue')
and specifying the initial value.

3. What is the return value of a useState call?
The useState call returns :

• a variable that point to the state value … or rather a variable that receives a value from an object that points to the different values of the state
• and a function which allow to switch the old value to the new one which it will receive in parameter

[Daniel_Fuchs]

	1. How do we store state in class-based components?
		i. in props state
	2. How do we store state in functional components?
		i. const variable declared with useState
	3. What is the return value of a useState call?
		i. value of current state and a setter function for the state

[laserkavajen]

1.How do we store state in class-based components?
By using this.state and .setState
2.How do we store state in functional components?
Using useState allows the developer to have state variable in functional components.
3.What is the return value of a useState call?
It returns a pair of values: the current state and a function that updates it!

[Edward_Valencia]

1. How do we store state in class-based components?

We use this.state to store data and this.setState to change that data.

2. How do we store state in functional components?

We use useState hooks to store state in functional components.

3. What is the return value of a useState call?
   It returns two things, the current state and a function that updates it.
   For example,
   const [count, setCount] = useState()
   =
   this.state.count & this.setState in a class

[Yogalholic]

1. States are included in Objects

2. States are variables of a function

3. useState returns the state variable (I’m not sure about that one)

[biffen96]

How do we store state in class-based components?
By using this.state and and change it with this.setState()

How do we store state in functional components?
By using useState hooks to store the state in functional components

What is the return value of a useState call?
It returns the current state and a function that updates it

[ankit_7]

1. State is stored as this.state and further changes in state are bought via this.setState.

2. Using useState()

3. Returns the current state.

[marsrvr]

[CryptoDev]

1. we can store state in class based components by initializing the state with this.state = {“whatever values you want your state to have”} and change the state values using this.setState.

2. we can use react hooks by importing { useState} from ‘react’. We can then use the method useState() to initialize and change the state.

3. useState() returns a stateful value and a function to update it.

[leemac]

1. In class-based components state is stored in this.state and set with this.setState()

2. In functional components state is stored in useState hooks

3. A useState call returns the current state and a function to update the current state

[GalacticBrainBomb9]

1. we store state in class-based components by using this.state. and defined with this.setState.

2. We can store state in functional components with use.State(). Hooks are an updated way to initialize and change the state.

3.The return value of a useState call is the current state after it has been updated.

[CodyM]

1. you can store state in class-based components by initializing the current state with this.state and set the state with this.setState()
2. In functional components state is stored in useState hooks. You can use useState once it is imported and use it to initialize and change the state
3. A useState call returns the current state after it has been updated.

[Timmy]

How do we store state in class-based components?
In this.state object and this.setState.

class App extends Component {
  constructor() {
    super();
    this.state = {
      count: 0
    };
  }
  render() {
    return (
      <div className="App">
        <h1>Current count: {this.state.count}</h1>
        <button onClick={() => this.setState({ count: this.state.count + 1 })}>
          Increment
        </button>
      </div>
    );
  }
}

How do we store state in functional components?
By using useState hooks.

const [state, setState] = useState({
  count: 0
});

What is the return value of a useState call?
A pair of values: the current state and a function that updates it.

[gmarcotte]

@Lizette

1. How do we store state in class-based components?
2. How do we store state in functional components?
3. What is the return value of a useState call?

1. we use the setState() function and declare the state variables in the class.

2. we use hooks and for state its the useState hook. we use import statement: import React, { useState } from ‘react’; we can call the setter directly in side the function.

3. useState returns a pair of values, the name, and the setter function for that variable.

[kath7lee]

1. How do we store state in class-based components? - this.setState
2. How do we store state in functional components? - useState()
3. What is the return value of a useState call? - the current state