Simple pagination using reactjs

It give a simple Idea about how to do pagination in the reactjs

<script type="text/babel">
const rootHandle=document.getElementById('root')
const { useState }=React
const App=()=>{
const data1=[
{id:'a',name:'prafull'},
{id:'b',name:'asdas'},
{id:'c',name:'qqw'},
{id:'d',name:'qwe'},
{id:'e',name:'pljjs'},
{id:'f',name:'pmmmsd'},
{id:'g',name:'mmnnn'},
{id:'h',name:'pmms'},
{id:'i',name:'ponns'},
{id:'j',name:'poe'}
]
const [data,setData]=useState(data1)
const [list,setList]=useState([])
const getNames=(id)=>{
const result=data.filter((ele)=>{
if(ele.name.includes(id) ){
return ele
}
})
setList(result)
}
return(
<div>
<h1>Pagination</h1>
{data.map((ele)=>{
return <a key={ele.id} onClick={()=>getNames(ele.id)} href='#'> {ele.id} </a>
})}
<ul>
{list.map((ele)=>{
return <li key={ele.id}>{ele.name}</li>
})}
</ul>
</div>
)
}
ReactDOM.render(<App/>,rootHandle)