Komponen DOM React
Komponen-Komponen Umum
Semua komponen bawaan peramban mendukung beberapa props dan events.
Ini termasuk props spesifik React seperti ref
dan dangerouslySetInnerHTML
.
Komponen Form
Komponen-komponen bawaan peramban ini menerima masukan dari pengguna:
Komponen-komponen tersebut spesial dalam React karena dengan mengoper prop value
ke dalamnya, akan membuatnya menjadi controlled component.
Komponen Sumber Daya dan Metadata
Komponen bawaan peramban ini memungkinkan Anda memuat sumber daya external atau menyematkan metadata ke dokumen:
Komponen ini memiliki perilaku khusus di React karena React dapat merender mereka ke head sebuah dokumen, menangguhkan ketika sumber daya sedang dimuat, dan melakukan hal lainnya yang dideskripsikan oleh halaman yang direferensikan komponen tersebut.
Semua komponen HTML
React mendukung semua komponen HTML bawaan peramban. Ini termasuk:
<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>
Elemen HTML Custom
Jika Anda render sebuah tag menggunakan tanda hubung, seperti <my-element>
, React akan mengasumsikan Anda untuk render elemen HTML custom. Pada React, cara kerja rendering pada elemen custom akan berbeda dengan rendering pada tags bawaan peramban:
- Semua props dari custom element akan diserialisasikan menjadi strings dan selalu disetel menggunakan attributes.
- Custom elements menerima
class
ketimbangclassName
, danfor
ketimbanghtmlFor
.
Jika Anda render
sebuah elemen HTML bawaan peramban dengan atribut is
, maka itu akan diperlakukan sebagai custom element.
Semua komponen SVG
React mendukung semua komponen SVG bawaan peramban. Ini termasuk:
<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>