renderToStaticMarkup
renderToStaticMarkup
me-render sebuah pohon React yang non-interaktif ke string HTML.
const html = renderToStaticMarkup(reactNode, options?)
Referensi
renderToStaticMarkup(reactNode, options?)
Pada server, panggil fungsi renderToStaticMarkup
untuk me-render aplikasi Anda ke HTML.
import { renderToStaticMarkup } from 'react-dom/server';
const html = renderToStaticMarkup(<Page />);
Keluaran yang diberikan adalah HTML non-interaktif dari komponen-komponen React Anda.
Lihat lebih banyak contoh di bawah.
Parameter
reactNode
: Sebuah node React yang Anda ingin render ke HTML. Contohnya, sebuah node JSX seperti<Page />
.- opsional
options
: Obyek untuk pe-render-an server.- opsional
identifierPrefix
: String prefiks yang digunakan reak untuk ID yang dibuat olehuseId
. Ini berguna untuk menghindari konflik ketika menggunakan root yang berbeda di halaman yang sama.
- opsional
Nilai Balik
Sebuah string HTML.
Caveats
-
Keluaran dari
renderToStaticMarkup
tidak dapat dihidrasi (hydrate). -
renderToStaticMarkup
mendukung penggunaanSuspense
secara terbatas. Apabila sebuah komponen berada dalam kondisi suspended,renderToStaticMarkup
segera mengirimkan fallback-nya sebagai HTML. -
renderToStaticMarkup
bekerja dalam peramban, tetapi tidak direkomendasikan untuk digunakan dalam source code klien atau lingkungan peramban tersebut. Apabila Anda ingin me-render komponen ke HTML dalam peramban, ambil HTML dengan cara me-render dalam node DOM.
Penggunaan
Me-render pohon React yang non-interaktif sebagai HTML menjadi string
Panggil renderToStaticMarkup
untuk me-render aplikasi Anda dalam sebuah string HTML yang dapat Anda kirimkan dengan respons dari server Anda:
import { renderToStaticMarkup } from 'react-dom/server';
// Sintaks router ini tergantung dari framework yang Anda gunakan.
app.use('/', (request, response) => {
const html = renderToStaticMarkup(<Page />);
response.send(html);
});
Ini akan memproduksi HTML non-interaktif awal dari komponen-komponen React Anda.