This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2016-05-09
Channels
- # admin-announcements (6)
- # arachne (3)
- # beginners (66)
- # boot (84)
- # braveandtrue (1)
- # cider (84)
- # cljs-site (1)
- # cljsjs (3)
- # cljsrn (2)
- # clojure (138)
- # clojure-austin (2)
- # clojure-czech (1)
- # clojure-gamedev (6)
- # clojure-germany (15)
- # clojure-italy (2)
- # clojure-russia (26)
- # clojure-uk (51)
- # clojurescript (97)
- # css (1)
- # cursive (1)
- # datascript (13)
- # datomic (6)
- # devcards (2)
- # docker (1)
- # emacs (5)
- # hoplon (9)
- # immutant (5)
- # jobs (4)
- # leiningen (6)
- # luminus (27)
- # mount (4)
- # om (16)
- # om-next (4)
- # onyx (15)
- # other-languages (36)
- # overtone (1)
- # proton (3)
- # quil (1)
- # re-frame (11)
- # reagent (24)
- # rum (4)
- # spacemacs (3)
hello everyone - i have a stumbling block here with reagent/cljs-react-material-ui. maybe one of you can help:
(ns ui-sandbox.nav
(:require [cljsjs.material-ui] ; this also loads react (is within)
[cljs-react-material-ui.core :as mui]
[cljs-react-material-ui.reagent :as rui] ; that's the react-material-ui wrapper, not reagent itself!
[cljs-react-material-ui.icons :as icons]
[reagent.core :as reagent]))
; just an example how to use a full react class instead of the shorter form (because we will need that later!)
(defn user-menu []
(reagent/create-class
{:component-did-mount #(println "user-menu-did-mount")
:display-name "user-menu"
:reagent-render (fn []
[rui/icon-menu {:icon-button-element (mui/icon-button {:touch true} (icons/navigation-expand-more))}
[rui/menu-item {:primary-text "Edit Profile"}]
[rui/menu-item {:primary-text "Logout"}]])}))
(defn user-bar []
[rui/list
[rui/list-item {:primary-text "Michael Heuberger" :right-icon-button [user-menu]}]])
...
in the browser's dev console i get the error
"`material-ui.inc.js:2410 Warning: Failed propType: Invalid prop rightIconButton
supplied to ListItem
, expected a single ReactElement. Check the render method of smx3_ui_sandbox.nav.user_bar
."
@michael.heuberger: try to wrap the right-icon-button value with r/as-element
. The docstring says "Turns a vector of Hiccup syntax into a React element"
I did some react / redux stuff
@michael.heuberger: how does it compare in real life?
@lewix: I guess that the question was for me . I like reagent much more, because I feel that abstracting components as functions was a really great decision. Also the reagent atom provides a lot of stuff you need to wire up manually in the react apps.
@mihaelkonjevic: ah sorry. hehe thanks for catching that - do you feel as productive? I like redux middlewares a lot, there won't be a penury of the libraries around it anytime soon - do we have something similar in the reagent ecosystem?
I feel very productive, but I might be a wrong person to ask because I’m also lead dev on Keechma which is a micro framework for Reagent (http://keechma.com/). I would also recommend you to check re-frame https://github.com/Day8/re-frame to see how people architect their Reagent apps
I have done some react/redux and @mihaelkonjevic said what I think: reagent make it easy to do things you have to manually wire up on react
that and having the things clojurescript comes with: immutable data structures, core api, macros and clojure.async
I must confess to being really spoilt by Reagent+re-frame myself, and find it hard to go back to anything else. 😛
That suite should be called Recrack. Then I can say “once you go Recrack you can’t go back”. 😛
has anyone here tried elm?
@bojan.matic: only superficially .. and it was great
human-readable error messages. in particular, compile time errors w.r.t. schema was great. Seems like a big step up from what clojurescript can do in that space (prismatic schema is good, but still runtime :( )
more a react-question than a reagent-one. Why do a component (all components) re-render when I resize the window, but not if I programatically resize its parent component?
@nberger: thanks but reagent/as-element
doesnt work well for me. the life cycle seems broken, i.E. :component-did-mount #(println "user-menu-did-mount")
is never printed when you wrap it with as-element
@michael.heuberger: I'm far from the keyboard now, and haven't used as-element much myself, but I'd think the lifecycle should work. It'd be great if you could post a failing example, without material UI to make it simpler. Maybe you can use http://cljsfiddle.com to do that, it requires reagent.core
@michael.heuberger: What are you attempting to do? My suggestion might be off but if you ran into my sort of problem then create-class
worked well.