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 })