以下の例のようなコードがあります。ユーザーを URL に送信するクリック可能なグリッド セルを作成しようとしていますが、埋め込み画像ボタンがクリックされたときに onClick イベントのみを発生させ、他のイベントは発生させないようにしたいのですが、これは可能ですか? stopPropagation への呼び出しを追加しようとしましたが、最初の onClick が処理された後も、基になるリンクにリンクされたままになります。
const handleSaveClick = async (e, activity, Index) => { e.stopPropagation(); ... } ＜グリッド項目＞ handleLinkClick(payload.url, インデックス)} > <ツールヒント title={payload.title}> <タイポグラフィクラス名={clsx(classes.copy)}> {ペイロード.タイトル} <ボタン className={clsx(classes.savedButton)} onClick={(e) => handleSaveClick(e, ペイロード, インデックス)} >
<画像 className="{clsx(classes.savedIcon)}" src="//m.sbmmt.com/ja/wenda/{payload.isSaved" ? 保存されました : notSaved}>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
handleSaveClick 関数では、e.preventDefault() 関数を使用できます。 [画像の埋め込み] ボタンをクリックすると、handleSaveClick 関数が実行されます。e.preventDefault() はリンクのデフォルトの動作を防止し、リンクが URL に移動しないようにする必要があります。
リーリーさらに、クリック可能な領域またはボタンのアンカー タグを別の適切な要素に置き換えることを検討する必要があります。