React DOM Components
רכיבים נפוצים
כל רכיבי הדפדפן המובנים תומכים בחלק מה-props ובאירועים.
זה כולל גם props ייחודיים ל-React כמו ref ו-dangerouslySetInnerHTML.
רכיבי טפסים
רכיבי הדפדפן המובנים הבאים מקבלים קלט מהמשתמש:
הם מיוחדים ב-React כי העברת prop בשם value אליהם הופכת אותם ל-* controlled.*
רכיבי משאבים ומטא-דאטה
רכיבי הדפדפן המובנים האלה מאפשרים לטעון משאבים חיצוניים או להוסיף מטא-דאטה למסמך:
הם מיוחדים ב-React כי React יכולה לרנדר אותם ל-head של המסמך, לבצע suspend בזמן טעינת משאבים, ולהפעיל התנהגויות נוספות שמתוארות בדף ה-reference של כל רכיב.
כל רכיבי ה-HTML
React תומכת בכל רכיבי ה-HTML המובנים של הדפדפן. הרשימה כוללת:
<aside><audio><b><base><bdi><bdo><blockquote><body><br><button><canvas><caption><cite><code><col><colgroup><data><datalist><dd><del><details><dfn><dialog><div><dl><dt><em><embed><fieldset><figcaption><figure><footer><form><h1><head><header><hgroup><hr><html><i><iframe><img><input><ins><kbd><label><legend><li><link><main><map><mark><menu><meta><meter><nav><noscript><object><ol><optgroup><option><output><p><picture><pre><progress><q><rp><rt><ruby><s><samp><script><section><select><slot><small><source><span><strong><style><sub><summary><sup><table><tbody><td><template><textarea><tfoot><th><thead><time><title><tr><track><u><ul><var><video><wbr>
אלמנטים מותאמים אישית של HTML
אם תרנדרו תגית עם מקף, כמו <my-element>, React תניח שאתם רוצים לרנדר custom HTML element. ב-React רינדור אלמנטים מותאמים אישית עובד אחרת מרינדור תגיות דפדפן מובנות:
- כל props של custom elements עוברים serialization למחרוזות ותמיד נקבעים באמצעות attributes.
- custom elements מקבלים
classבמקוםclassName, ו-forבמקוםhtmlFor.
אם תרנדרו אלמנט HTML מובנה עם attribute בשם is, הוא יטופל גם הוא כ-custom element.
כל רכיבי ה-SVG
React תומכת בכל רכיבי ה-SVG המובנים של הדפדפן. הרשימה כוללת:
<a><animate><animateMotion><animateTransform><circle><clipPath><defs><desc><discard><ellipse><feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feDistantLight><feDropShadow><feFlood><feFuncA><feFuncB><feFuncG><feFuncR><feGaussianBlur><feImage><feMerge><feMergeNode><feMorphology><feOffset><fePointLight><feSpecularLighting><feSpotLight><feTile><feTurbulence><filter><foreignObject><g><hatch><hatchpath><image><line><linearGradient><marker><mask><metadata><mpath><path><pattern><polygon><polyline><radialGradient><rect><script><set><stop><style><svg><switch><symbol><text><textPath><title><tspan><use><view>