Fundamentals
API
useBreakpointChange
Specification
Executes a given callback function whenever a breakpoint changes. Provides a breakpoint name that matches the current viewport as the first argument.
Definition
1
type useBreakpointChange = (
2
callback: (breakpointName: string) => void,
3
debounceDuration?: number,
4
)
Copied!
Example
1
import React, { useState } from 'react'
2
import { useBreakpointChange } from 'atomic-layout'
3
4
export const Component = () => {
5
const [currentBreakpoint, setCurrentBreakpoint] = useState()
6
7
useBreakpointChange((breakpointName) => {
8
setCurrentBreakpoint(breakpointName)
9
})
10
11
return <p>Current breakpoint: {currentBreakpoint}</p>
12
})
Copied!
Last modified 2yr ago
Copy link