This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2016-05-19
Channels
- # admin-announcements (1)
- # beginners (26)
- # boot (6)
- # cider (14)
- # cljsjs (29)
- # cljsrn (19)
- # clojure (87)
- # clojure-austin (5)
- # clojure-belgium (10)
- # clojure-brasil (2)
- # clojure-dusseldorf (15)
- # clojure-greece (17)
- # clojure-russia (51)
- # clojure-sanfrancisco (4)
- # clojure-sweden (20)
- # clojure-uk (31)
- # clojurescript (111)
- # core-matrix (2)
- # cursive (9)
- # datascript (15)
- # datomic (41)
- # dirac (1)
- # emacs (8)
- # flambo (1)
- # funcool (4)
- # hoplon (72)
- # lein-figwheel (3)
- # off-topic (2)
- # om (79)
- # om-next (2)
- # onyx (17)
- # other-languages (16)
- # re-frame (62)
- # reagent (26)
- # remote-jobs (1)
- # rum (3)
- # spacemacs (5)
- # untangled (120)
is there a way to colocate the initial global state pertaining to a particular component in the component defui itself
OMG! I just don’t get it. I’ve been trying for like 2 days and still can’t make it work as I think it should work. Someone please help me. it’s driving me nuts. what I need:
a) a component that renders list of items (data is in single array, every row has :color
prop)
b) one instance of this component that would show only items with :color :white
c) another instance of this component that would show only items with :color :black
my instinct tells me that it’s gotta be 3 defui
objects,
- first, is Item
with query like
'[:id :color]
and ident [:items/by-id id]
.
- second ItemsList
with params and query that uses subquery of Item
and in componentWillMount
should update-query!
with parameters taken from om/props this
(?)
- third Root
that should use two factories of ItemsList
and send the right props in
@ag have you thought about doing this in your data? {:items/filtered {:white [[:items/by-id 5] 'etc]}
@selfsame: I just want to understand how it works… what is the right syntax for queries that have subqueries and also parameters?
then you'll have to set up a read method that uses the params and use om.next/set-query!
to configure the components
and fwiw reads get invoked often - I like to cache heavy filter ops in the app-state with transact 🙂
thank god for https://github.com/awkay/om-tutorial i would be lost without it
Hi, new to Clojure/ClojureScript and om/next; Is it okay for me to provide the reconciler my app-state in an atom instead of letting it perform the normalization? The docs do this and say it’s okay for the Counter example, but I couldn’t find a more complex example. The reason I wish to do this is because I’m recursively building out my React components from a structure and filling in the already de-duped content which is separate that is my app state is atom { :structure {…} :data […]}
@whistlerbrk: you can pass :normalize false
as an option when you create the reconciler
@dnolen excellent, thank you
hey guys… I have a similar thing almost identical to the on in tutorial https://github.com/omcljs/om/wiki/Components,-Identity-&-Normalization
strange thing though it uses only one read method. it works fine (even with one), but I’m stumbled, how and why? so imagine defmethod read :list/two
is never being called…
That sounds pretty strange
oh wow… apparently sending entire AST to the server (which includes 2 lists) and resolving it there, returns entire dataset in one request and since the data is in the state
, component never has to use read
for list/two
Hmm, but when you resolve it locally without a remote
the parser will dispatch on both keys
even when sending it to a remote, that sounds strange, I'll have to fire up a repl
yeah what I’m doing is this on the client for read :list/one
I check if (if (get @state key) is not empty and if it is I send the entire ast to the server. on the server I am dispatching read methods for both list:one
and list:two
but then there I filter records (that come from one source) and since entire ast is on the server it fills up both lists. and sends them back to the client
I assume there is a local re-read happening after the response has been merged?
so I wrote this function small useful abstraction ontop of input textboxes
(defn text-edit [{:keys [on-key-enter on-key-escape on-blur]
:or {on-key-enter #{} on-key-escape #{}}
:as props}]
(html
[:input (merge props
{:type "text"
:on-key-down #(case (.-which %)
13 (on-key-enter (.-value (.-target %)))
27 (on-key-escape))})]))
the question I have is if I convert this abstraction to a defui, I don't how to do this, because om next separates out computed props from regular props, so this simple (merge props ...) that I did can't be done with defuihave you seen the 'anonymous version' of defui?
checkout ui
@iwankaramazow: sorry not sure how ui answers my question, ui still requires computed and regular props separation
ok, I guess you just wrap it in a defn, and mix computed and regular, I wonder what the consequence of passing event handlers to regular props is
I'm not sure, I think it has something to do with clojurescripts immutable data structures and React. @anmonteiro: could probably answer this
yah UI still separates computed and regular props.. I don't see how it answers my question
(defn TextEdit [{:keys [on-key-enter on-key-escape ]
:or {on-key-enter #{} on-key-escape #{}}
:as props}]
(ui Object
(render [this]
(html
[:input (merge props
{:type "text"
:on-key-down #(case (.-which %)
13 (on-key-enter (.-value (.-target %)))
27 (on-key-escape))})]))))
(defn text-edit [props] ((om/factory (TextEdit props)) {}))
(defui RootView
Object
(render [this]
(dom/div nil (text-edit {:placeholder "foo"
:on-key-enter #(js/alert "enter!")}))))
honestly I would go with a pure function
I misread the question, defui/ui has nothing to do with this
just make sure there's a defui that passes the right handlers to the pure function
For a reference implementation: https://github.com/swannodette/om-next-demo/blob/master/todomvc/src/cljs/todomvc/item.cljs
"defui has nothing to do with this" I could use functions a lot more than I have, any defui with just a render function could be a pure function
That's something you have to learn for yourself. As a heuristic I only use defui components when they absolutely need a query
has anyone built tables with Next? I need to build a component that would take data (column definitions and rows)
I gave all my top level components bogus idents which gives them a meta path like [[:selection :panel]]
where the om/path is [:selection]
does om.next have any opinion on how changes should be transmitted to the server? i.e., like this, except for updates: https://github.com/omcljs/om/blob/c5ce1fc09725280792c6d4ff15366680cbfe19f7/src/main/om/next/impl/parser.cljc#L15-22
wondering if anyone has opinions on whether start-up conditions such as whether a user is logged in or whether critical data has been fetched should be coditionally checked inside of a top level component for all the view these checks are in place for, or if this should be handled at the router level ?
i'm trying to change my todo list and add a new item to it, any om helpers for this in working with the normalized data?
(om/merge! reconciler
{:todo/by-id {3 {:todo/id 3 :todo/title "new!"}}
:widget/root {:todo/list [[:todo/by-id 1]
[:todo/by-id 2]
[:todo/by-id 3]
]}})
`(because {3 {:todo/id 3 :todo/title "new!"}} replaces what was there previously in the state)
@jasonjckn: The default merge fn is fairly simple. I had to write my own to handle cases like yours. You can pass a custom merge fn to the reconciler.