React TypeScript – Bootstrap Navbar Höhe abfragen mit useRef-Hook


Wenn die Bootstrap Navigation angezeigt wird, verdeckt sie mit ihrer Fläche ein Teil der darunter liegenden Seite. Möchte man es verhindern und die Seite anschliessend an die Navigation anzeigen, muss der Seite ein margin-top, margin-left, margin-right oder margin-bottom Wert, je nach dem wo die Navigation platziert ist, hinzugefügt werden. Der Wert soll der Höhe bzw. Breite der Navigation entsprechen. Aber wie kommt man an den aktuellen Wert? Die Lösung liefert der React useRef-Hook.

React – Image wird nicht angezeigt


In einem React-Projekt werden die Bilder standardmäßig aus dem public-Ordner geladen. Die Image-Pfade werden relativ zu diesem Ordner angegeben. Versucht man ein Bild aus dem src-Verzeichnis zu laden, wird es nicht angezeigt. Die beiden unteren <img>-Elemente sind identisch und laden das Bild public/images/logo192.png, wenn es dort existiert:

<img src="./images/logo192.png" alt="" width="300" height="300" />
<img src="images/logo192.png" alt="" width="300" height="300" />

React-HTML-img [Image]