Updated tutorial code for Om 0.1.6. See more at http://www.lexicallyscoped.com/2013/12/25/slice-of-reactjs-and-cljs.html
;; Updated tutorial code for Om 0.1.6, 2014-01-16 | |
;; http://www.lexicallyscoped.com/2013/12/25/slice-of-reactjs-and-cljs.html | |
;; See comments below for details on the changes. | |
(def app-state | |
(atom {:comments [{:author "Pete Hunt" :text "This is a comment."} | |
{:author "Jordan Walke" :text "This is *another* coment"}]})) | |
(defn comment [{:keys [author text]} owner] | |
(om/component | |
(dom/div #js {:className "comment"} | |
(dom/h2 nil author) | |
(dom/span nil text)))) | |
(defn change-author [cs new-author] | |
;; The cursors internal path is used, no explicit path needed | |
(om/update! cs (fn [comments] | |
(mapv #(assoc % :author new-author) comments)))) | |
(defn comment-list [cs owner] | |
(om/component | |
(dom/div nil | |
(dom/div #js {:className "commentList"} | |
;; Helper function build-all builds a vector of components | |
(om/build-all comment cs)) | |
(dom/button #js {:onClick #(change-author cs "Fredrik")} | |
"Change authors")))) | |
(defn comment-box [state owner] | |
(om/component | |
(dom/div #js {:className "commentBox"} | |
(dom/h1 nil "Comment") | |
;; Cursors support lookups to yield new cursors, so | |
;; they can be used directly to pass sub-state, | |
;; maintaining paths internally | |
(om/build comment-list (:comments state))))) | |
(om/root | |
app-state | |
comment-box | |
(.getElementById js/document "content")) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This comment has been minimized.
I think comment-box needs to appear before app-state in your arguments list starting at line 39.