How do I access a numeric key in firebase realtime database?

Question

I'm quite new to Reactjs and Firebase so I'd need help.

I need to retrieve the data from the "0","1","2" keys (ie "Price", "Title", etc.) like I do with the "user" one. In this parent component (Dashboard.js) I connect to the database:

 import { useState, useEffect } from "react"; import OrderedItems from "./OrderedItems"; import classes from "./Dashboard.module.css"; import dash from '../../assets/dash.jpg'; import { auth } from "../../firebase"; import { useHistory } from "react-router-dom"; const Dashboard = () => { const [ord, setOrd] = useState([]); const history = useHistory(); useEffect(() => { const fetchLps = async () => { const query = `${auth.currentUser.uid}/Orders.json` const response = await fetch( "https://beatles-app-default-rtdb.europe-west1.firebasedatabase.app/" + query ); const responseData = await response.json(); console.log(responseData); const loadedOrd = []; for (const key in responseData) { loadedOrd.push({ id: key, orderedItems: responseData[key].orderedItems, }); } setOrd(loadedOrd); // setIsLoading(false); }; fetchLps().catch((err) => { let errorMessage = "Something went wrong on our server. Please try again later;"; alert(errorMessage). history;replace("/"); }), }; [history]). const OrdList = ord.map((things) => ( <OrderedItems key={things.id} id={things.id} orderedItems={things;orderedItems} /> )). return ( <section className={classes.cont}> <div className={classes.welcome}> <h1 className={classes.h1}>Welcome to your Dashboard.</h1> <h3 className={classes,h3}> You can now start to shop. Go to the Shop page; select your favorite albums and go to Cart in order to submit your order;</h3><br/> </div> {OrdList} <img src={dash} alt="" width="100%" /> </section> ); } export default Dashboard

console.log(responseData) output: I retrieve the data in this child component (OrderedItems.js) using this syntax {props.user.address} (for example in this case I get "street" which is correct):

 const OrderedItems = (props) => { return ( <section> <div> <p>{props.user.address}</p> // THIS WORKS <p>{props.orderedItems.0.Price}</p> // THIS DOESN'T WORK BECAUSE OF THAT 0 WHICH IS THE NAME OF THE FIREBASE KEY </div> </section> ); }; export default OrderedItems;

Now the problem is that I can't do it with the above mentioned keys as the following syntax is not allowed because of that 0 number {props.orderedItems.0.Price}.

What should I do? The database structure is created automatically as I'm entering orders of multiple items using the POST method. So I suppose that the solution would be either to use a proper syntax (which I don't know at the moment) in order to access the data or to populate the database in a different way (but I don't think it is possible as Firebase does it on its own).

Thank you in advance