4

Hago una obtencion de data con $.getJSON() sin problemas, obtengo lo que deseo de mi base de datos y después la trabajo con .then pero en esta linea

getKeys().then(data => data.map(key => keys.push(key)));

eso lo guardo en mi variable 'keys' que es un array pero al momento de abrirlo en el navegador lo veo por consola y me sale asi [], le doy click y se despliega de esta manera

Array[0]
0:Object
1:Object
length:2

y el array me queda como tipo objeto evitando que lo pueda mapear, como puedo hacer para que me quede mapeable sin tener que hacer this.setState() en React? (con mapeable me refiero a Array.prototype.map())

2 respuestas 2

1

Ya lo solucione con esto:

getKeys().then(data => this.setState({ keys : data.filter(info => info.keygen == key) }))

La idea es que no me revele todas las keys sino que solo me revele la que fue seleccionada, por eso lo filtré con respecto a lo enviado. Saludos y gracias por las respuestas.

1
  • No olvides marcar tu respuesta o la que creas pertinente.
    – gugadev
    Commented el 16 mar. 2017 a las 2:18
0

Estas utilizando promises. Los promises se ejecutan de manera asíncrona, por lo tanto si intentas acceder a 'keys' fuera del promise probablemente la linea donde imprimes el contenido se ejecute antes que el promise en sí, por lo tanto te imprimira un array vacío pero cuando inspeccionas el objeto en el debugger seguramente veras que ya esta lleno de valores, esto porque el código asíncrono seguramente solo esta desfasado por milésimas.

Si imprimes keys e esta manera

getKeys().then(data => data.map(key => keys.push(key))); // asincrono
console.trace(keys);

la segunda linea se ejecutara antes que el promise, para trabajar con los valores del promise y mutar el estado del componente React, debes mutar el estado al finalizar la ejecución del promise, esto se logra haciéndolo dentro del chain de promises, no fuera.

getKeys()
    .then(data => {
        data.map(key => keys.push(key));
        return keys;
    })
    .then(keys => {
        ... alguna logica extra
        this.setState({keys: keys})
    })

Sobre la ultima parte la variable 'keys' sigue siendo un array no es un objeto.

para trabajar con código asíncrono también puedes utilizar async/await que también involucra promises

3
  • gracias por responder, bueno básicamente ya he trabajado con .then() pero resulta que esta vez no necesito setear un estado ya que por ser una key privada si la seteo con this.setState({key : key}) obtendre el resultado y podre trabajarlo con un .map() sin problemas, el punto es que mis keys quedarán en un estado de react el cual será visible por cualquier persona abriendo así una vulnerabilidad en mi sistema, básicamente no se me ocurre alguna forma de obtener un $.getJSON() y agregarlo a un array limpio :c sin then(). Commented el 15 mar. 2017 a las 21:43
  • No veo porque puede haber vulnerabilidad a menos que expongas el state en la vista, ademas los componentes React son hechos para la vista, si estas recuperando información sensible de algún servicio lo ideal es que esa información la recuperes en otro lugar de la aplicación como puede ser de un Action en el caso que uses Flux y ese valor lo almacenes en el store o en un contexto global, es lo que hago en el caso de almacenar la sesión y su AccessToken por ejempo... Commented el 15 mar. 2017 a las 22:21
  • Entiendo, entonces sabes como se ocultan los states a la vista? :o porque con react en el navegador puedes ver todos los states pero nunca los he ocultado :o Commented el 15 mar. 2017 a las 22:27

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.