@SeventimeSsS

Как получить id элемента?

Есть карточки товаров которые появляются через цикл, но проблема в том что когда добавляешь в избранное одну карточку сразу добавляются все. Я примерно понимаю что нужно чтобы стейт сравнивался с индексом, но как правильно указать индекс? (=== index этого нет в коде, но мне кажется примерно так и должно работать)
{Array.isArray(visibleData) ? visibleData.map((chanel, index) => {
                        return (
                            <div href={chanel.url} className="chanel__item" key={index}>
                                <img src={star} alt="star" onClick={addFavoriteChanel} id={index} className={`star ${favorite <b>=== index</b>  ? 'active' : ''}`} />
                                <img src={chanel.image} alt="" className="chanel__img" />
                                <div className="chanel__title"><div className="chanel__item-number">{chanel.number}. &nbsp;</div {chanel.name_ru}</div>
                            </div> 
                        ) 
                    }) : null}


const [favorite, setFavorite] = useState('');
 
 const addFavoriteChanel = (e) => {
        const star = e.target.id
        console.log(favorite)
        if(favorite === star) { 
            setFavorite('');
        } else {
            setFavorite(star)
       }
    }
  • Вопрос задан
  • 114 просмотров
Решения вопроса 1
HistoryART
@HistoryART Куратор тега JavaScript
Начинающий пингвинус
<img src={star} alt="star" onClick={() => addFavoriteChanel(index)} id={index} className={`star ${favorite <b>=== index</b>  ? 'active' : ''}`} />

const [favorite, setFavorite] = useState(0);

const addFavoriteChanel = (index) => {
        if(favorite === index) { 
            setFavorite(0);
        } else {
            setFavorite(index)
       }
    }
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы