ตัวแปลง HTML เป็น JSX

ห่อในคอมโพเนนต์

ชื่อคอมโพเนนต์

HTML

JSX

การแปลง HTML เป็น JSX คืออะไร?

JSX คือไวยากรณ์ที่คล้าย HTML ซึ่งใช้ในคอมโพเนนต์ React แม้จะดูเหมือน HTML แต่มีความแตกต่างที่สำคัญ: class กลายเป็น className, for กลายเป็น htmlFor, สไตล์อินไลน์ใช้อ็อบเจ็กต์ JavaScript แทนสตริง แท็กทั้งหมดต้องปิดตัวเอง และตัวจัดการเหตุการณ์ใช้ camelCase เครื่องมือนี้จัดการการแปลงทั้งหมดโดยอัตโนมัติ เพื่อให้คุณวาง HTML ได้โดยตรงและรับ JSX ที่ถูกต้องพร้อมใช้งานในคอมโพเนนต์ React ของคุณ

วิธีใช้ตัวแปลง HTML เป็น JSX

วาง HTML มาร์กอัปในแผงด้านซ้าย (หรือคลิก 'ตัวอย่าง' เพื่อโหลดตัวอย่าง)
ผลลัพธ์ JSX จะปรากฏทันทีทางด้านขวา
เปิดใช้งาน 'ห่อในคอมโพเนนต์' (ไม่บังคับ) เพื่อรับคอมโพเนนต์ฟังก์ชันที่สมบูรณ์พร้อมวาง
คัดลอก JSX โดยใช้ปุ่ม 'คัดลอก JSX'

Keywords: HTML เป็น JSX, ตัวแปลง HTML JSX, แปลง HTML เป็น React, ตัวแปลง className, JSX ออนไลน์, ตัวแปลง React JSX, การแปลง HTML JSX