ใช้ส่วนประกอบ React ของคุณได้ทุกที่ในของคุณ
HTML เป็นส่วนประกอบของเว็บ (องค์ประกอบที่กำหนดเอง)
การสาธิต ⚡ เอกสาร
2kb gzip'd · ไม่มีการพึ่งพา · รองรับ IE
การต่อเชื่อมใหม่สามารถทำได้ผ่านพื้นที่เก็บข้อมูลแพ็กเกจ npm จำเป็นต้องมีปฏิกิริยา 18
# npm
npm install remount react react-dom
# yarn
yarn add remount react react-dom
yarn add remount
npm install remount
เริ่มจากส่วนประกอบ React กันก่อน นี่คือหนึ่ง:
const Greeter = ( { name } ) => {
return < div > Hello, { name } ! < / div >
}
ใช้ Defin() เพื่อกำหนดองค์ประกอบที่กำหนดเอง มากำหนด <x-greeter>
องค์ประกอบ:
import { define } from 'remount'
define ( { 'x-greeter' : Greeter } )
ตอนนี้คุณสามารถใช้มันได้ทุกที่ใน HTML ของคุณ! -
< x-greeter props-json =' {"name":"John"} ' > </ x-greeter >
⚡ เอกสาร API →
แนวคิดบางประการเกี่ยวกับสาเหตุที่คุณอาจต้องการพิจารณา Remount สำหรับโครงการของคุณ:
การเพิ่ม React ไปยังแอปที่ไม่ใช่ SPA คุณสามารถใช้ส่วนประกอบ React บนหน้าใดก็ได้ของไซต์ HTML "ปกติ" เหมาะสำหรับการเพิ่ม React ให้กับแอปที่สร้างบน Rails หรือ Phoenix | |
- ทำงานร่วมกับกรอบอื่นๆ การต่อเชื่อมใหม่ทำให้คุณสามารถใช้ส่วนประกอบ React ได้เหมือนกับองค์ประกอบ HTML อื่นๆ ซึ่งหมายความว่าคุณสามารถใช้ React กับ Vue, Angular หรือไลบรารี/เฟรมเวิร์ก DOM อื่นๆ ได้ |
<x-greeter props-json="{...}">
) (เอกสาร)<x-greeter name="John">
) (เอกสาร)Remount รองรับเบราว์เซอร์ทั้งหมดที่ React 18 รองรับ
Custom Elements API # ("Web Components") จะถูกใช้หากมีให้บริการ (Chrome/67+) และจะเลือกใช้ API ที่เข้ากันได้แทน
⚡ เอกสารสนับสนุนเบราว์เซอร์ →
ติดตั้งใหม่ © 2022, Rico Sta. ครูซ. เผยแพร่ภายใต้ใบอนุญาต MIT
เขียนและดูแลโดย Rico Sta ครูซด้วยความช่วยเหลือจากผู้ร่วมให้ข้อมูล (รายชื่อ)
ricostacruz.com · GitHub @rstacruz · Twitter @rstacruz