Give unique ID (key) for each data in Sdata.js

 index.js:1 Warning: Each child in a list should have a unique "key" prop. See https://reactjs.org/link/warning-keys for more information.

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import Cards from './Cards';
import Sdata from './Sdata';
console.log(Sdata[0].sname)
ReactDOM.render(
  <>
  <h1 className="heading_style" > List of five cards</h1>
    {/* Use map method */}
    {Sdata.map((val) =>{
      return(
        <Cards
          key = {val.id}
          imgsrc = {val.imgsrc}
          title = {val.title}
          sname = {val.sname} />
          )
    })};
  </>,
  document.getElementById('root')
);

Sdata.js

const Sdata = [
  {
      id: 1,
      sname: "Dark",
      imgsrc: "https://picsum.photos/261/251",
      title: "Netflix original Series",
  },
  {
      id: 2,
      sname: "Dark",
      imgsrc: "https://picsum.photos/261/252",
      title: "Netflix original Series",
  },
  {
      id: 3,
      sname: "Dark",
      imgsrc: "https://picsum.photos/260/253",
      title: "Netflix original Series",
  },
  {
      id: 4,
      sname: "Dark",
      imgsrc: "https://picsum.photos/261/254",
      title: "Netflix original Series",
  },
  {
      id: 5,
      sname: "Dark",
      imgsrc: "https://picsum.photos/261/255",
      title: "Netflix original Series",
  },
  {
      id: 6,
      sname: "Dark",
      imgsrc: "https://picsum.photos/262/255",
      title: "Netflix original Series",
  },
]
export default Sdata;