remount

Memasang kembali

Gunakan komponen React Anda di mana saja di file
HTML sebagai komponen web (elemen khusus).

Demo ⚡ Dokumen
2kb gzip · Tidak ada ketergantungan · Dukungan IE

Instalasi

Remount tersedia melalui repositori paket npm. Bereaksi 18 diperlukan.

 # npm
npm install remount react react-dom
# yarn
yarn add remount react react-dom

• Melalui benang: yarn add remount
• atau npm: npm install remount

Penggunaan

Mari kita mulai dengan komponen React apa pun. Ini dia:

 const Greeter = ( { name } ) => {
  return < div > Hello, { name } ! < / div >
}

Gunakan define() untuk mendefinisikan elemen khusus. Mari kita definisikan elemen <x-greeter> :

 import { define } from 'remount'

define ( { 'x-greeter' : Greeter } )

Anda sekarang dapat menggunakannya di mana saja di HTML Anda! ?

 < x-greeter props-json =' {"name":"John"} ' > </ x-greeter >

⚡ Dokumentasi API →

Kasus penggunaan

Beberapa gagasan mengapa Anda mungkin ingin mempertimbangkan Remount untuk proyek Anda:

	Menambahkan React ke aplikasi non-SPA Anda dapat menggunakan komponen React di halaman mana pun di situs HTML "biasa". Sangat bagus untuk menambahkan React ke aplikasi yang dibangun di Rails atau Phoenix.
	? Interop dengan kerangka kerja lain Remount memungkinkan Anda menggunakan komponen React sama seperti elemen HTML lainnya. Ini berarti Anda dapat menggunakan React dengan Vue, Angular, atau pustaka/kerangka DOM lainnya.

Lebih banyak fitur

• Props JSON (misalnya, <x-greeter props-json="{...}"> ) (dokumen)
• Atribut yang diberi nama (misalnya, <x-greeter name="John"> ) (dokumen)
• Menggunakan API Elemen Khusus (bila tersedia)
• Penggantian ke API yang kompatibel untuk browser lain
• Mode Shadow DOM (bila tersedia)

Dukungan peramban

Remount mendukung semua browser yang didukung React 18.

API Elemen Khusus ^# ("Komponen Web") akan digunakan jika tersedia (Chrome/67+), dan jika tidak, akan dikembalikan ke API yang kompatibel.

⚡ Dokumen dukungan browser →

Dokumentasi

• dokumentasi API
• Build — Pembuatan ES2015+ dan ES Module juga disediakan.
• FAQ dan Pemecahan Masalah — Mulai di sini jika Anda menemukan masalah apa pun.
• Perbandingan dengan alternatif
• Dukungan peramban

Terima kasih

pasang kembali © 2022, Rico Sta. Cruz. Dirilis di bawah Lisensi MIT.
Ditulis dan dikelola oleh Rico Sta. Cruz dengan bantuan kontributor (daftar).

ricostacruz.com · GitHub @rstacruz · Twitter @rstacruz