Support Ukraine πŸ‡ΊπŸ‡¦
πŸ‡ΊπŸ‡¦
Help Provide Humanitarian Aid to Ukraine.
React
Learn
Reference
Community
Blog

    react@18.2.0

  • Hooks
    • useCallback
    • useContext
    • useDebugValue
    • useDeferredValue
    • useEffect
    • useId
    • useImperativeHandle
    • useInsertionEffect
    • useLayoutEffect
    • useMemo
    • useReducer
    • useRef
    • useState
    • useSyncExternalStore
    • useTransition
  • Components
    • <Fragment> (<>)
    • <Profiler>
    • <StrictMode>
    • <Suspense>
  • APIs
    • createContext
    • forwardRef
    • lazy
    • memo
    • startTransition
  • react-dom@18.2.0

  • Components
    • Common (e.g. <div>)
    • <input>
    • <option>
    • <progress>
    • <select>
    • <textarea>
  • APIs
    • createPortal
    • flushSync
    • findDOMNode
    • hydrate
    • render
    • unmountComponentAtNode
  • Client APIs
    • createRoot
    • hydrateRoot
  • Server APIs
    • renderToNodeStream
    • renderToPipeableStream
    • renderToReadableStream
    • renderToStaticMarkup
    • renderToStaticNodeStream
    • renderToString
  • Legacy APIs

  • Legacy React APIs
    • Children
    • cloneElement
    • Component
    • createElement
    • createFactory
    • createRef
    • isValidElement
    • PureComponent

Is this page useful?

API Reference
Legacy React APIs

Component

Pitfall

We recommend defining components as functions instead of classes. See how to migrate.

Component is the base class for the React components defined as JavaScript classes. Class components are still supported by React, but we don’t recommend using them in new code.

class Greeting extends Component {
render() {
return <h1>Hello, {this.props.name}!</h1>;
}
}
  • Reference
    • Component
    • context