How to print datas by using local json file in react

Question

Friends,

i am trying to print all 10 titles by using json local data, i am displaying them on console and i wrote the map function in order to call all titles under back to button as you see there is displaying 1 box. And jsx code is below too. How to make them as card?

Answer 1

Try this instead:

const menus = Datas.map((result) => {
  <div className="menus-cards" key={result.key}>
    {result.description}
  </div>
};
return (
  <div className="main-menu-items">
    <button className="back-up-button" onClick={handleClickBack}>Back to</button>
    <div className="center-of-main">
      {menus}
    </div>
  </div>
);

Moved iterating over the menus outside of return, fixed up the key attribute, and assigned the value to the menus variable. Then inside return you can just render via {menus}. In your snippet, it looks like you are iterating over Datas incorrectly (ex: you call items.caption but items is an Array).

Answer 2

if you just want to print the data and not care about styling it but just want see it just do this

{JSON.stringify(Datas)}