How to use the useImperativeHandle function from react

Find comprehensive JavaScript react.useImperativeHandle code examples handpicked from public code repositorys.

62
63
64
65
66
67
68
69
70
71
            // eslint-disable-next-line no-console
            console.error(videoRef.current.constructor.manifest.name, error);
        }
    }
}, []);
React.useImperativeHandle(ref, () => ({ dispatch }), []);
React.useEffect(() => {
    return () => {
        dispatch({ type: 'command', commandName: 'destroy' });
    };
fork icon129
star icon0
watch icon0

1515
1516
1517
1518
1519
1520
1521
1522
1523
1524
if (getName(button.type) === 'MenuButton') {
  buttonProps.isOpen = isOpen;
}
var renderButton = /*#__PURE__*/react.cloneElement(button, buttonProps);
useMenuChange(onMenuChange, isOpen);
react.useImperativeHandle(instanceRef, function () {
  return {
    openMenu: openMenu,
    closeMenu: function closeMenu() {
      return toggleMenu(false);
fork icon48
star icon881
watch icon6

130
131
132
133
134
135
136
137
138
139
140
141
const TinderCard = React.forwardRef(({ flickOnSwipe = true, children, onSwipe, onCardLeftScreen, className, preventSwipe = [] }, ref) => {
  const swipeAlreadyReleased = React.useRef(false)


  const element = React.useRef()


  React.useImperativeHandle(ref, () => ({
    async swipe (dir = 'right') {
      if (onSwipe) onSwipe(dir)
      const power = 1000
      const disturbance = (Math.random() - 0.5) * 100
fork icon0
star icon0
watch icon0

3454
3455
3456
3457
3458
3459
3460
3461
3462
3463
      newColumnWidths.set(column.key, width);
    }
    return newColumnWidths;
  });
}, [isWidthInitialized, flexWidthViewportColumns, gridRef]);
react.useImperativeHandle(ref, function () {
  return {
    element: gridRef.current,
    scrollToColumn: scrollToColumn,
    scrollToRow: function scrollToRow(rowIdx) {
fork icon0
star icon0
watch icon1

18
19
20
21
22
23
24
25
26
27
/*#__PURE__*/ React.forwardRef(function (_props, ref) {
  var _usePatchElement = (0, _usePatchElement3['default'])(),
    _usePatchElement2 = (0, _slicedToArray2['default'])(_usePatchElement, 2),
    elements = _usePatchElement2[0],
    patchElement = _usePatchElement2[1];
  React.useImperativeHandle(
    ref,
    function () {
      return {
        patchElement: patchElement,
fork icon0
star icon0
watch icon2