Elmish.Hooks.UseEffect

data UseEffect :: Type -> HookTypedata UseEffect t0

traced :: DebugWarning => Aff Unit -> Hook (UseEffect Unit) Unit

A version of useEffect that logs messages, state changes and render times. Intended to be used with qualified imports: UseEffect.traced.

traced' :: forall @a. DebugWarning => Eq a => a -> (a -> Aff Unit) -> Hook (UseEffect a) Unit

A version of useEffect' that logs messages, state changes and render times. Intended to be used with qualified imports: UseEffect.traced'.

useEffect :: Aff Unit -> Hook (UseEffect Unit) Unit

The useEffect hook takes an effect (Aff) to run and runs it in the init of the resulting component. E.g.:

todos :: ReactElement
todos = Hooks.component Hooks.do
  todos /\ setTodos <- useState []

  useEffect do
    todos <- API.fetchTodos
    liftEffect $ setTodos todos

  Hooks.pure $ H.fragment $ todoView <$> todos

useEffect' :: forall @a. Eq a => a -> (a -> Aff Unit) -> Hook (UseEffect a) Unit

This is like useEffect, but allows passing a value which, when it changes, will trigger the effect to run again. E.g.:

view :: ReactElement
view = Hooks.component Hooks.do
  count /\ setCount <- useState 0

  useEffect' count \c -> liftEffect $
    HTMLDocument.setTitle ("You clicked " <> show c <> " times") =<< document =<< window

  Hooks.pure H.button_ "" { onClick: setCount $ count + 1 } "Click me"