react-to-print: UpdatedDom ignored on onbeforeprint

Hi, I am using this lines

<ReactToPrint
  trigger={() => <a href="#">Print this out!</a>}
  content={() => componentRef.current}
  onBeforePrint={() => setPrintMode(true)}
  onAfterPrint={() => setPrintMode(false)}
/>

where i am setting Printmode to true, in order to render additional Content (Legend) for the print.

{printMode &&
  <div>
    {data.legende.map((l) => <div>{`${l.abk}: ${l.text}`}</div>)}
  </div>
}

However. It is called and the DOM updated (as i can see in the background, but in the print window it still shows the “non-print-version”.

the full thing I use:

const componentRef = useRef();

return (
  <div className={css(styles.formsContainer)} ref={componentRef} >
    <h2 className={styles.formsTitle}>
      {Strings.PressespiegelHeaderText}
      {!printMode &&
        <ReactToPrint
          trigger={() => <a href="#">Print this out!</a>}
          content={() => componentRef.current}
          onBeforePrint={() => setPrintMode(true)}
          onAfterPrint={() => setPrintMode(false)}
        />
      }
      </h2>
      {data &&
        <div>
          {`Ausgabe vom ${data.datum}`}
          {data.kapitel.slice(1).map((kapitel) => {
            return (
              <div key={kapitel.id}>
                <div>
                  {kapitel.bezeichnung}
                </div>
                <ListBase
                  hideArrow
                  items={kapitel.KM}
                  renderItem={renderKM}
                />
              </div>
            );
          })}
          {printMode &&
            <div>
              {data.legende.map((l) => <div>{`${l.abk}: ${l.text}`}</div>)}
            </div>}
            {data.copyright}
        </div>
      }
    </div>
);`