How to run a function when component has mounted (and pass a setX function to it) ?
jerbaroo opened this issue · comments
You can see in the example below what I am trying to accomplish, in short:
- create a
setLocation
function viauseState
- when the component mounts run a function from 3rd party JS:
initMap
which will attach to the Deku-generated DOM - pass
setLocation
toinitMap
, so that when locations on the map are clicked the Purescript can be informed
foreign import initMap :: EffectFn1 (Location -> Effect Unit) Unit
myMap :: Nut
myMap = Deku.do
setLocation /\ location <- useState initialLocation
onDidMount (runEffectFn1 initMap setLocation) $
D.div [ DA.id_ "map-row" ]
[ D.div [ DA.id_ "map-container" ] []
, location <#~> locationInfo
]
onDidMount
is in the Pursuit documentation, but does need seem to be in the create-deku-app
-generated project.
The answer was to use Self
.
The Pursuit documentation and the README is out of date (as they both mention Deku.Lifecycle which is a solution in an old version of Deku).
myMap :: Nut
myMap = Deku.do
setLocation /\ location <- useState initialLocation
D.div
[ DA.id_ "map-row"
, Self.self_ \_ -> liftEffect $ runEffectFn2
initLeaflet allLocations setLocation
]
[ D.div [ DA.id_ "map-container" ] []
, location <#~> locationInfo
]