Fork me on GitHub

Has anyone used reagent.core/create-class? Can it be used in a react project in place of using reagent.core/render?


create-class returns a react component class, like you might use from javascript


@tom they serve different purposes, take a look at this recipe and you might be able to tell the difference:


Thanks! Going to attempt to get a re-frame app to be usable by a javascript react project. I thought I'd start with that.


when i think about those functions, i tend to rename them in my head: create-class --> create-component, and render --> mount


If the create-class ("create-component") is used, then render ("mount") can be done from javascript?


@tom I havent dont that, but i imagine you can. If it doesn't just work, see "simple react integration" in this post:


Is that correct to do '(reagent/render [#'login] (.-body js/document))' and '(reagent/render [#'main-page] (.-body js/document))' to render pages? I´m trying to do this with Material Design Lite and if I call #'login first and then call #'main-page after, the event for menu button is not attached. I think I have to reaload the material.js again?


So, I just used (.upgradeAllRegistered js/componentHandler) after the render and the menu button is working. Is there the way the framework work? Or I have to ask in #material_design_lite channel? lol


@fabrao: not using mdl but I think you need to register some handler that is triggered for newly added mdl components. I think the mdl page mentions that somewhere


Hi reagent peeps, I've got some odd behaviour for you all. I've just found a solution to a problem that caused React to throw an Invariant Violation ... Unable to find element, but I don't know why it worked. I had a component that took a map of properties as an argument:

(defn dropdown
  [props children]
In the props map, I had a mapping that used the key :key. So you'd call the component like this:
[dropdown {:key "abcd" :value "someval" :on-change #(...)}]
It turns out that React does not like this. Renaming the :key property to :k (or anything else) solves the problem. I know React uses the :key key in the metadata map in lists of things as a unique identifier, but this wasn't metadata - any ideas why this causes a problem? I realise using a key name of :key isn't the best idea, but the weird thing is that it does not cause a problem on my colleagues' OSX machines or our development Linux environment, only on my Windows machine. I can't for the life of me see how being on Windows could possibly cause a React issue, but maybe there's something I don't know about Closure?


@conan: you can use either a :key attribute or :key metadata to supply an id to a component...


ah, you learn something new every day. thanks!