Hi Dave,
Your advice is great !
I wrote a wrapper as you suggested and it worked fine.
(defn wrapper
[app owner]
(om/component
(dom/div nil
(om/build menu-table-header app)
(om/build menu-table app)
(om/build menu-table-button app))))
(om/root
wrapper
app-state
{:target (. js/document (getElementById "app"))})
Thanks,
Makoto
2014-07-10 13:34 GMT+09:00 Dave Della Costa <[email protected]>:
> Oh, you shouldn't need that (apply ...) in there before the dom/div
> call, sorry. Otherwise I think it should work.
>
> (2014/07/10 13:30), Dave Della Costa wrote:
> > Hi Makoto,
> >
> > Try wrapping them all in a single component, like so:
> >
> > (defn wrapper
> > [app owner]
> > (om/component
> > (apply dom/div nil
> > (om/build menu-table-header app)
> > (om/build menu-table app)
> > (om/build menu-table-button app))))
> >
> > Haven't tested the above, but something like that...
> >
> > DD
> >
> > (2014/07/10 13:18), Makoto H. wrote:
> >> HI,
> >>
> >> I have written some components using OM. I would like to these
> components
> >> on the same web page as follows:
> >>
> >> 1. menu-table-header
> >> 2. menu-table
> >> 3. menu-table-button
> >>
> >> The following is my prototype code. In my om/root can display only one
> component and I am looking for how can I show multple om components.
> >>
> >> (def app-state
> >> (atom
> >> {:menus
> >> [
> >> {:name "menu1" :kind "category1"}
> >> {:name "menu2" :kind "category2"}
> >> {:name "menu3" :kind "category3"}
> >> {:name "menu4" :kind "category2"}
> >> ]
> >> }))
> >>
> >> (defn menu-table-header
> >> [app owner]
> >> (reify
> >> om/IRender
> >> (render [this]
> >> (dom/div
> >> nil
> >> (dom/ul #js {:className "nav-tabs nav"}
> >> (dom/li #js {:className "active"}
> >> (dom/a #js {:href "#"} "menu1")
> >> )
> >> (dom/li nil
> >> (dom/a #js {:href "#"} "menu2")
> >> )
> >> (dom/li nil
> >> (dom/a #js {:href "#"} "menu3")
> >> )
> >> )
> >> (dom/h2 #js {:className "text-center"} "mwnu4"
> >> )
> >> )
> >> )))
> >>
> >> (defn menu-row
> >> [app owner]
> >> (reify
> >> om/IRender
> >> (render [this]
> >> (dom/tr nil
> >> (dom/td nil (:name app))
> >> (dom/td nil (:kind app))
> >> )
> >> )
> >>
> >> )
> >> )
> >>
> >> (defn menu-table
> >> [app owner]
> >> (reify
> >> om/IRender
> >> (render [this]
> >> (dom/div
> >> nil
> >> (dom/table
> >> #js {:className "table table-striped"}
> >> (dom/thead nil
> >> (dom/tr nil
> >> (dom/th nil "menu")
> >> (dom/th nil "category")
> >> ))
> >> (apply dom/tbody
> >> nil
> >> (om/build-all menu-row (:menus app))
> >> ))))))
> >>
> >>
> >> (defn menu-table-button
> >> [app owner]
> >> (reify
> >> om/IRender
> >> (render [this]
> >> (dom/div
> >> #js {:className "input-append"}
> >> (dom/button {:className "btn btn-lg" :typw "button"} "register")
> >> (dom/button {:className "btn btn-lg" :typw "button"} "change")
> >> (dom/button {:className "btn btn-lg" :typw "button"} "delete")
> >> (dom/button {:className "btn btn-lg" :typw "button"} "copy")
> >>
> >> )
> >> )))
> >>
> >>
> >> (om/root
> >> menu-table
> >> app-state
> >> {:target (. js/document (getElementById "app"))})
> >>
> >> Thanks,
> >> Makoto
> >>
>
> --
> Note that posts from new members are moderated - please be patient with
> your first post.
> ---
> You received this message because you are subscribed to the Google Groups
> "ClojureScript" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To post to this group, send email to [email protected].
> Visit this group at http://groups.google.com/group/clojurescript.
>
--
Note that posts from new members are moderated - please be patient with your
first post.
---
You received this message because you are subscribed to the Google Groups
"ClojureScript" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/clojurescript.
