Team Sparta Libraries
GitHubGitHub
  • Union
    • Naming
    • TypeScript
    • hackle
      • eslint-backend-config
      • eslint-frontend-config
      • prettier-config
      • ts-config
      • react
        • InView
        • Separated
        • Spacer
        • Suspense
        • SwitchCase
        • When
        • useBoolean
        • useClickAway
        • useDebounce
        • useDocumentVisibility
        • useHover
        • useIntersectionObserver
        • useInterval
        • useIsClient
        • useIsomorphicLayoutEffect
        • useLockBodyScroll
        • useMediaQuery
        • usePreserveCallback
        • useResizeObserver
        • useStopwatch
        • useThrottle
        • useTimer
        • useToggle
      • types
      • PartialRecord
      • Values
      • utils
        • getLastItem
        • isEmptyArray
        • isLastIndex
        • unique
        • calculateAge
        • getDateDiff
        • getNewDate
        • getTimePastText
        • isAfterOfEqual
        • isBeforeOrEqual
        • isMac
        • isMobileDevice
        • noop
        • clamp
        • random
        • randomInt
        • sumBy
        • formatPhoneNumber
        • isArray
        • isBoolean
        • isClient
        • isDate
        • isFunction
        • isNil
        • isNotNil
        • isNull
        • isNumber
        • isObject
        • isServer
        • isString
        • isUndefined
        • delay
        • snakeCase
Question? Give us feedback →Edit this page
packagesreactcomponentsWhen

When

조건에 따라 컴포넌트를 렌더링합니다.

<When condition={true}>
  <div>children</div>
</When>

condition이 true일 경우 children을 렌더링합니다.

<When condition={() => false} fallback={<div>fallback</div>}>
  <div>children</div>
</When>

condition이 false일 경우 fallback을 렌더링합니다.

SwitchCaseuseBoolean

MIT 2025 © Nextra.