Код IT
← Каталог

React — компоненты-рецепты — Переключатель вкл/выкл

Фрагмент из «React — компоненты-рецепты»: Переключатель вкл/выкл.

Plain text main.jsx
import { useState } from 'react';

export default function App() {
  const [on, setOn] = useState(false);

  return (
    <div className="app">
      <p>Статус: {on ? 'включено' : 'выключено'}</p>
      <button type="button" onClick={() => setOn((v) => !v)}>
        {on ? 'Выключить' : 'Включить'}
      </button>
    </div>
  );
}
import { useState } from 'react';

export default function App() {
  const [on, setOn] = useState(false);

  return (
    <div className="app">
      <p>Статус: {on ? 'включено' : 'выключено'}</p>
      <button type="button" onClick={() => setOn((v) => !v)}>
        {on ? 'Выключить' : 'Включить'}
      </button>
    </div>
  );
}