من این اری رو دارم:
const data =
[
{title:"فروش و نصب شیشه اتوموبیل امین", urlPic:gl} ,
{title:"اپارتمان 195 متری رحمانیه تک واحدی", urlPic:ho} ,
{title:"تولید اکاسیو اکاسیف تیرچه فلزی بتنی",urlPic:fo} ,
{title:"برد تغذیه سوخته ولی صفحه سالم 42hv37100", urlPic:tv} ,
{title:"دکوری جواهر کوبی" ,urlPic:za} ,
{title:"جواهر کاری فروغ کادوییماندگار", urlPic:za1} ,
{title:"لباس مجلسی سایز44",urlPic:ma} ,
{title:"مبل مبلمان راحتی چستر باکس", urlPic:mob} ,
{title:"گلدان سرامیکی با گل طبیعی و پایه گلدان فقط" ,urlPic:fl} ,
{title:"پیکان وانت مدل 84" ,urlPic:pk} ,
{title:"اپل سیز 10pro max 256g دو سیم کارت" ,urlPic:ph} ,
{title:"کیف مجلسی شیک ترند", urlPic:ba},
]
حالا میخوام مپ کنم ولی به همراه یک دکمه برای حذف اون ها
<div className="map-p">
{data.map((card,index) => { return (
<div className="mapdiv" key={`div-${index}`}>
<Link to={"/detailscamp"}>
<img className="mapimg" src={card.urlPic} />
</Link>
<div className="elem">
<h2 className="mapp" >
{card.title}
</h2>
<button className="mapdelet">
حذف
</button>
</div>
</div>)})}
</div>
حالا سوالم اینکه باید چه چیزی برای باتن بزارم که وقتی انکلیک شد اونقسمت مربوطه از اری رو برام حذف کنه؟
اول دیتا رو تبدیلش کن به state بعدم برای حذف دیتا رو برابر کن با دیتایی که اون ایندکس رو نداره
const [data, setData] = useState(...)
function del(index) {
setData(data.filter((d, i) => i === index))
}
بعدم برای اون باتنه میذاریش
<button onClick={e => del(index) }>... </button>
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟