This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2022-04-20
Channels
- # announcements (3)
- # babashka (7)
- # beginners (36)
- # calva (71)
- # cider (25)
- # clj-commons (5)
- # cljdoc (19)
- # cljs-dev (5)
- # clojure (223)
- # clojure-austin (2)
- # clojure-bay-area (1)
- # clojure-europe (31)
- # clojure-france (6)
- # clojure-nl (2)
- # clojure-norway (19)
- # clojure-spec (13)
- # clojure-uk (7)
- # clojurescript (127)
- # core-logic (2)
- # cursive (21)
- # datalevin (53)
- # datomic (9)
- # emacs (37)
- # events (1)
- # graphql (8)
- # jobs (12)
- # lsp (8)
- # off-topic (92)
- # pathom (49)
- # pedestal (1)
- # polylith (3)
- # re-frame (25)
- # releases (2)
- # sci (11)
- # shadow-cljs (13)
- # vim (10)
I got a hotloading issue. I am on react native, but that should not matter much as regard to react on web. The problem is, the main screen is A. Starting from A, I navigated to B, and then C. Now I edit the code related to C. Shadowcljs happily reloaded the code of C. But how do I re-render C and show it? Currently I added a dev/after-load on the starting-screen A, which is the entry point. But that makes the screen to show A instead of C everytime I change code.
that it entirely out of the control of shadow-cljs. it just calls a function. what that renders is up to you.
I take my words back. seems adding the ^dev/after-load at register-component
indeed calls that function, but some other mechanism is needed to trick RN to rerender all the app
(defn register-component {:dev/after-load true}
[]
(.registerComponent ^js (.-AppRegistry rn)
"myapp"
;; wrap in :>f to make a functional component
#(r/reactify-component (constantly [:f> app]))))
you should use this approach for hot-reloading https://github.com/thheller/reagent-react-native/blob/master/src/main/test/app.cljs#L34
Yup. I was searching for the forceUpdate
method, but seems the result from r/reactify-component
does not contain such field.
you are free to copy this but all the steps it does are necessary. so be careful if you try to build your own. https://github.com/thheller/shadow-cljs/blob/master/src/main/shadow/react_native.cljs
yup. first step you have to get the instance of a component: https://github.com/thheller/shadow-cljs/blob/650d78f2a7d81f33cb2590e142ddcbcbd756d781/src/main/shadow/react_native.cljs#L47
Now I doubt this works. The method only updates the root component, but cannot recursively updating child components.
then one of your components decides to skip rendering. see the gotchas described here https://code.thheller.com/blog/shadow-cljs/2019/08/25/hot-reload-in-clojurescript.html