cljsrn 2022-09-30 | Slack Archive

dsp21:09:05

Edit: resolved. 🙂 Good evening and happy friday all. Got another dumb question 🙂 I have a Stack Navigator, and wish to do something like the following: https://reactnavigation.org/docs/preventing-going-back/ I've been experimenting at the repl, unsuccessfully:

app.fx> (-> @!navigation-ref (j/get :addListener)) ;; this doesn't seem correct
#object[addListener]

app.fx> (-> @!navigation-ref (j/call :addListener)) ;; well, this at least gets a function
#object[Function]
app.fx> (j/call (-> @!navigation-ref (j/call :addListener))
                "beforeRemove"                   ;; as per docs, arity 2: a type of event,
                (fn [_] (print "hello, world"))) ;; and a callback

Execution error (TypeError) at (<cljs repl>:1).
undefined is not an object (evaluating 'f__31485__auto__.call')
:repl/exception!

I'll try inserting it into a screen and see if that has any effect, but I think I'm holding it wrong again. Any help appreciated!

dsp21:09:18

(As expected, adding it in a screen rather than executing at the repl gets identical results)

dsp21:09:08

yes, I am being stupid. It returns a function that can be called to unsubscribe from the event.

dsp21:09:41

Likely all I need is (j/call @!navigation-ref :addListener :beforeRemove (fn [_] (print "hello, world"))) let's see...

dsp23:09:19

ok, seems this is the correct invocation: (.addListener @!navigation-ref "state" #(>evt [:some-fx-example "got state change event"])) where "state" here is a event type that fires whenever the navigator state changes at all. for future explorers. (i.e., it's really not complicated, the same as clojure java methods. don't know how i ended up down the rabbithole on that one.) the use case that I wanted this for probably isn't particularly viable with my use of re-frame, but i learnt something. 👍

dsp00:10:47

some further stuff. am using react navigation just for the convenience of screen display, but don't actually want to care about the routing it does. I guess I am smashing rocks together and making my own navigator & routing. pain point was despite me having a regular routing flow via re-frame events, react navigation had this concept of stacked screens that people could just cycle back to with the back button. after some head-scratching, I modified my navigate fx:

(defn navigate [name]
  (.navigate @!navigation-ref name (clj->js {}))
  (.reset @!navigation-ref (clj->js {:index 0 :routes [^js (.getCurrentRoute @!navigation-ref)]})))

so there's no routing state directly within the navigator anymore, so nothing to go "back" to. similarly on android:

(.addEventListener BackHandler "hardwareBackPress" (fn []
                                                      (print "back button pressed")
                                                      true))

would be where I can persist application state before app minimisation, though returning true completely suppresses the back button action.

2022-09-30

Channels