Загрузка...
Загрузка...
Если reChecker работает неправильно, опишите проблему и укажите страницу, на которой она возникла. Оставьте email или телефон — мы ответим после проверки.
Конвертируйте HTML в React JSX компоненты
<div className="container">
<header className="header">
<nav className="nav">
<a href="/" className="logo">Logo</a>
<ul className="menu">
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
</header>
<main className="main">
<article className="card" style={{ padding: '20px', backgroundColor: 'white', borderRadius: '8px' }}>
<h1 className="title">Welcome</h1>
<p className="description">This is a sample HTML that will be converted to React JSX.</p>
<img src="/image.jpg" alt="Sample image" className="image" />
<input type="text" placeholder="Enter text" disabled={true} />
<button onClick="handleClick()">Click me</button>
</article>
</main>
<footer className="footer">
<p>© 2024 Company</p>
</footer>
</div>Конвертер преобразует HTML-разметку в JSX, совместимый с React. Автоматически заменяет class на className, for на htmlFor, обрабатывает style-объекты и экранирует спецсимволы.
Конвертация HTML в JSX
Корректная обработка class, for, style
Экранирование спецсимволов
Экспорт как React-компонент
В JavaScript class — зарезервированное слово. React и JSX используют className для соответствия DOM-атрибуту class. Конвертер автоматически выполняет эту замену, чтобы разметка была валидной в React.
Руководства и советы по теме