Как отменить переход по ссылке?

Question

[Юрий Иванов]

Добрый день, подскажите пожалуйста
есть карточка, он вся обернута в линк, в ней есть кнопка
Кнопка тоглится (меняется цвет и текст
Я хочу что бы при клике на любое место карточки пользователь переходил на новую страницу
Кроме клика на кнопку
Как это делается? я понимаю что с помощью превент дефаулт, но куда его повесить
В саму функцию нет, на онклик другая функция(тогла вызывается)
подскажите пожалуйста

<Link to={`/HeroPage/${id}`} target="_blank">
      <>
        <div 
          className={styles.heroCard__container}>
          <h2 className={styles.heroCard__title}>{title}</h2>
          <img src={img}/>
          <button
            style={{backgroundColor: `${color}`}}
            onClick={():void => indexisbtnActive()}
            className={styles.hero__add}>
            <img src={imgBtn}/>
            {btnText}
          </button>
        </div>
      </>
    </Link>

Answer 1

[black1277]

Попробуй так

<button
            style={{backgroundColor: `${color}`}}
            onClick={ (e):void => { e.preventDefault(); indexisbtnActive() } }
            className={styles.hero__add}>
            <img src={imgBtn}/>
            {btnText}
          </button>

нужно остановить всплытие события, чтобы оно до Link не доходило.

Comments

[Юрий Иванов]

помогло, только не пропагинейшен, а превент дефаулт
поправьте пожалуйста, мб кто-то на вопрос наткнется

[black1277]

Юрий Иванов, поправил.