React-pdf: ref = {}の呼び出しに3回反応しますが、カスタムコールバックは十分に役立ちません

ねえ@nnnikolay 、
はい、これはすべてのコンポーネントの完全に正常な動作です（注意してください-要素ではなくコンポーネント）Reactの更新。

さらに、ページがDocumentコンポーネントの参照を使用してレンダリングされているかどうかを確認することは非常に悪い考えです。

私がお勧めできる唯一の方法は、レンダリングが成功するのをリッスンしたいPageコンポーネントに配置されたonRenderSuccess propコールバックです。

inputRef propをPageコンポーネントにアタッチすることでこれを行うこともできます。これにより、 ref関数がPageコンポーネントによってレンダリングされたルートdiv要素に渡されます。 ただし、3.0.0以降では、ページの読み込み/レンダリング状態でのスタイル設定を容易にするために、 Pageルートdivが以前よりも早く表示されるため、この方法は推奨されません。

返信とアイデアをありがとう@wojtekmaj 、まず第一に、 onRenderSuccessは引数を取らないので、このコールバックでPage DOMノードの位置を見つける方法が明確ではありません。ページ、その中であなたのアドバイスを聞いてうれしいです。

それでも、 inputRefは、ページのどこに<div>がレンダリングされているか（上部と左側の座標）を知る必要があるため、問題ありません。

ああ、そうだね。 onRenderSuccessは、実際にレンダリング内容に関する詳細情報を提供する必要があります。

現在、回避策を実行できます（読みやすくするためにコードを簡略化）。

const pageNumber = 1;

return (
  <Document>
    <Page
      pageNumber={pageNumber}
      onRenderSuccess={() => doSomething(pageNumber)}
    />
  </Document>
);

しかし、私はそれについて完全に同意します。 コールバック関数の改善が3.0の私のリストに載っています！ :)

改善点はマージされたばかりで、新しいv3.0.0-alpha.3で最初に利用可能になります。