How to Mapping Props to an Array in React?

Hello, welcome to therichpost.com. In this post, I will tell you, How to Mapping Props to an Array in React? Reactjs is a Javascript Library to build user interface.

Here is the example code for this:

Object.keys() is used to convert the object to array, and create the JSX using Array.map():

const props = {
  "links": {
    "link1": "https://www.google.com",
    "link2": "https://www.yahoo.com",
    "link3": "https://www.facebook.com",
    "link4": "https://www.twitter.com",
    "link5": "https://www.instagram.com",
    "link6": "https://www.gmail.com"
  }
};

const Links = ({ links }) => {
   return (
      <div>
        {
          Object.keys(links).map((link) => (
            <p key={link}>{ links[link] }</p>
          ))
        }
      </div>
    )
  }

ReactDOM.render(
  <Links {...props} />,
  demo
);


<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="demo"></div>

 There are so many things in reactjs and I will let you know all. If you have any query then please comment.