¿Por qué no establecer setstate añadiendo mi matriz en el estado?

votos
1

Tengo que crear un área de texto que, tomadas de múltiples enlaces entonces split()en una matriz sí Su funcionamiento muy bien, pero yo quiero establecer que la matriz en mi stateen linkList: []pero cuando hago clic en el botón para enviar me da matriz vacía como inicializar. pero cuando de nuevo pulse el botón para enviar entonces me da a mi lista deseada, ¿por qué? aquí son de código y salidas

onSubmit = event => {
    this.setState({ loading: true, host: undefined });
    const { text, linkList } = this.state;

    console.log(text);
    const mList = text.split(\n).filter(String);
    console.log(mList);
    this.setState({
      linkList: [...mList]
    });
    console.log(linkList);

    event.preventDefault();
  };

consola de salida (primer clic)

youtube.com
google.com
facebook.com
------------------------------------------------------------
[youtube.com, google.com, facebook.com]
------------------------------------------------------------
[]

Salida de consola (segundo clic)

youtube.com
google.com
facebook.com
--------------------------------------------- 
[youtube.com, google.com, facebook.com]
---------------------------------------------
[youtube.com, google.com, facebook.com]
Publicado el 13/01/2020 a las 23:51
fuente por usuario
En otros idiomas...                            


3 respuestas

votos
0

El siguiente código podría ayuda.

onSubmit = event => {
    this.setState({ loading: true, host: undefined }, () => {
      const { text, linkList } = this.state;

      console.log(link);
      const mList = text.split("\n").filter(String);
      console.log(mList);
      this.setState({
        linkList: [...mList]
      }, () => {
        console.log(linkList);
        event.preventDefault();
      });
    });
  };
Respondida el 13/01/2020 a las 23:54
fuente por usuario

votos
1

setStatees asíncrona. Eso significa que no ocurre de inmediato, pero muy poco tiempo más tarde en su lugar. Si se agrega una:

console.log(linkList)

a la parte superior de su método render, verá los artículos que se anexan al igual que usted espera.

Respondida el 13/01/2020 a las 23:54
fuente por usuario

votos
1

Probablemente será anexado, es simplemente no está disponible hasta la próxima render.

A partir de la documentación :

setState()no siempre actualizar inmediatamente el componente. Fuere por lotes o aplazar la actualización hasta más tarde. Esto hace que la lectura this.statecorrecta después de llamar a setState()un problema potencial . En cambio, el uso componentDidUpdateo una setStatedevolución de llamada ( setState(updater, callback)), cualquiera de los cuales se garantiza que el fuego después de que la actualización se ha aplicado.

Respondida el 14/01/2020 a las 00:07
fuente por usuario

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more