Options
All
  • Public
  • Public/Protected
  • All
Menu

External module "use-observable-callback"

Index

Functions

useObservableCallback

  • useObservableCallback<Output, Event, Args>(init: function, selector?: undefined | function): [function, Observable<Output>]
  • Returns a callback function and a events Observable.

    Whenever the callback is called, the Observable will emit the first argument of the callback.

    (From v2.1.0) Optionally accepts a selector function that transforms a list of event arguments into a single value.

    If you need a value instead of an Observable, see example on useObservableState.

    Node: useObservableCallback will call init once and always return the same Observable. It is not safe to access closure variables (except Observables) directly inside init. Use useObservable and withLatestFrom instead.

    Examples:

    import { useObservableCallback, useSubscription } from 'observable-hooks'
    
    const Comp = () => {
      const [onChange, textChange$] = useObservableCallback<
        string,
        React.FormEvent<HTMLInputElement>
      >(event$ => event$.pipe(
        pluck('currentTarget', 'value')
      )) // or just use "pluckCurrentTargetValue" helper
    
      useSubscription(textChange$, console.log)
    
      return <input type="text" onChange={onChange} />
    }

    Transform event arguments:

    import { useObservableCallback, identity } from 'observable-hooks'
    
    const [onResize, height$] = useObservableCallback<
      number,
      number,
      [number, number]
    >(identity, args => args[1])
    
    // onResize is called with width and hegiht
    // height$ gets height values
    onResize(100, 500)

    Type parameters

    • Output

    • Event

    • Args: any[]

    Parameters

    • init: function

      A function that, when applied to an inputs Observable, returns an Observable.

        • (events$: Observable<Event>): Observable<Output>
        • Parameters

          • events$: Observable<Event>

          Returns Observable<Output>

    • Optional selector: undefined | function

      A function that transforms a list of event arguments into a single value.

    Returns [function, Observable<Output>]

Generated using TypeDoc