javascript - single - setstate react

Reaccionar setState+¿De dónde viene ''prevState''?

Question

Acabo de empezar a aprender React y JavaScript.
Mientras realizaba el tutorial, obtuve este código de ejemplo de un componente, que crea un botón de alternar.
Esto es parte del código:

class Toggle extends React.Component {
constructor(props) {
super(props);
this.state = {isToggleOn: true};
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
this.setState(prevState => ({ // prevState?
isToggleOn: !prevState.isToggleOn
}));
}

2 cosas que me están molestando aquí:

1. ¿De dónde vino el argumento prevState al prevState ?
   No veo nada como var prevState = this.state; Antes de llamarlo, y aún así, funciona.
2. La sintaxis de la función de flecha: ¿por qué los paréntesis después de la flecha?
   ¿Por qué no el argumento arg => { statement; } usual arg => { statement; } arg => { statement; } trabajo de sintaxis aqui?

Lo siento por las preguntas de novato ...

Answer 1

1. prevState es proporcionado por React junto con props , ambos de los cuales son opcionales.

2. El paréntesis permite varias líneas donde, si no usara el paréntesis, se vería obligado a utilizar una return . Podría usar una sola línea pero no necesita las llaves.

   • Actualización : olvidé mencionar un caso específico en el que se requiere tener paréntesis. Si está devolviendo un objeto sin una declaración de return , debe envolverlo entre paréntesis. Gracias @joedotnot por atrapar eso. Entonces () => {foo: true} generará un error porque parece una función y foo: true es una línea no válida. Para solucionar esto, debe verse como () => ({ foo: true })