當我點擊父鏈接時，它也會觸發按鈕的點擊，我希望這兩個事件分開。

<Link className="product-item__link" to={`/products/${product.category}/${product.id}`} >
    <div className='product-item'>
        {/*I have here other elements*/}
        <button className="product-item__btn" onClick={() => addToCart(product)}>Add to cart</button>
     </div>
</Link>

在按鈕單擊的函數調用中添加停止傳播

<Link className="product-item__link" to={`/products/${product.category}/${product.id}`} >
    <div className='product-item'>
        {/*I have here other elements*/}
        <button className="product-item__btn" onClick={(e) => addToCart(e, product)}>Add to cart</button>
     </div>
</Link>

更改函數定義

const addToCart = (e, product) => {
      e.stopPropagation();
      e.preventDefault();
      //rest of the code...
}

感謝貢獻一個堆棧溢出的答案！

請務必回答問題。提供詳細信息并分享您的研究！但是要避免…

尋求幫助、澄清或回應其他答案。根據意見發表聲明；用參考資料或個人經歷來支持他們。要了解更多，請查看我們關于撰寫精彩答案的提示。