Prefetching data apollo

Question

私はアポロと遊んでいて、再詰めして質問を受けました。

私はonMouseOverのデータをプリフェッチする機能を実装しました。そのコンポーネントにマウスオーバーすると、同時に2つの同じ要求が行われます。なぜどんなアイデア？

const prefetchData = (id) =>() => { 
    client.query({ 
     query:FETCH_DATA, 
     variables:{id}, 
    }) 
    } 
<Link style={{ textDecoration: 'none' }} onMouseOver={prefetchData(id)} to={`/posts/${id}`}> 

Answer 1

<Link />内のDOM要素あなたのマウスオーバーに<Link />依存から湧き上がっマウスイベントもございます。

Answer 2

onMouseOverからonMouseEnterに変更すると、そのトリックが行われました。

<Link style={{ textDecoration: 'none' }} onMouseEnter={prefetchData(id)} to={`/posts/${id}`}>