Usando REST, estoy recuperando un objeto (formato JSON
) que se convertirá en una matriz para que pueda insertarse en una tabla.
Esto se hace en la función de renderizado de React.
La entrada se actualiza cada N minutos desde el back-end.
¿Cómo convierto un objeto en una matriz?
Solo necesito los valores, no las claves , ya que las claves ya están presentes como valores de columna de antemano en la tabla misma.
Puede usar Object#values
(ECMAScript 2017), pero no es compatible con IE (consulte la compatibilidad del navegador ).
Nota: La especificación ECMAScript 6 define en qué orden se deben recorrer las propiedades de un objeto. Esta entrada de blog explica los detalles .
const map = { a: 1, b: 2, c: 3 }; const result = Object.values(map); console.log(result);
Si necesita admitir IE, puede usar Object#keys
con Array#map
:
const map = { a: 1, b: 2, c: 3 }; const result = Object.keys(map).map((key) => map[key]); console.log(result);
No estoy seguro de que te refieras al objeto Mapa o a un objeto JS ordinario. Sin embargo, solo para variar, me gustaría mencionar que los objetos Map están en su mayoría (probablemente siempre) en forma de cadena como JSON.stringify([...myMap])
. Entonces, si recibe un objeto Map en datos JSON, puede ser que deba hacer algo como;
var myMap = new Map().set(1,"hey").set(2,"you"), mapData = JSON.stringify([...myMap]), values = JSON.parse(mapData).map(d => d[1]); console.log("mapData:",mapData); console.log("values:",values);
Puede establecer el valor inicial como matriz en primer lugar. Mira este ejemplo:
const [conversations, setConversations] = useState([]); // fianal data is array useEffect(() => { const fetchConversations = async () => { const res = await axios.get("/conversations/" + user._id); setConversations(res.data); }; fetchConversations(); }, [user._id]);
res.data
convierte en matriz usando useState([])
como valor inicial y se convierte en objeto usando useState({})
.
Y mapea esta matriz:
return ( <> {conversations.map((conv) => (<Conversations key={conv._id} conversation={conv} />))} </> )