我正在學習反應的基礎知識，目前正在探索互聯網上提供的某些問題陳述。一個這樣的問題陳述要求我為帶有上一個、下一個和重置按鈕的文本幻燈片創建者創建一個反應應用程序。我能夠創建到這里 - 我的 app.js 文件看起來像這樣 -import React from 'react';import MyComponent from './MyComponent'import slidesData from './slidesData'import SlideComponent from './SlideComponent'import './App.css';function App(){const slidestate=slidesData.map(slide=><SlideComponent key={slide.id} sli={slide}/>)return(<div id="main-div">  {slidestate}<MyComponent />  </div>)}export default App;我的 SlideComponent.js 看起來像 -import React from 'react'function SlideComponent(props){return(    <div>    <h1>{props.sli.title}</h1>    <p>{props.sli.description}</p>    </div>)}export default SlideComponent我的“MyComponent.js”看起來像這樣 -import React from 'react'function MyComponent(){return(    <div>        <button>Reset</button>                <button>Previous</button>             <button>Next</button>            </div>)}export default MyComponent我希望從中呈現文本幻燈片的 JSON 文件看起來像 -const slidesData = [{id:1,title:"title1",description:"hello first slide"},{id:2,title:"title2",description:"hello second slide"}]export default slidesData我對狀態和道具以及 useEffect() 組件以及功能和類組件有基本的了解。我想使用按鈕將幻燈片更改為上一個、下一個或重置，并分別希望立即呈現該幻燈片（僅來自 json 文件）（現在也不擔心幻燈片的時間安排）。我知道我必須在這里使用狀態更改，但我不知道如何進行。請幫助我。請原諒我沒有正確設計它。我基本上想提供這個功能，然后繼續 css 部分。請幫助我實現這一目標。這對我有很大幫助。