Geek Answers Handbook

Using inline style strings with ClojureScript, Om and React.js

I want to use this Om fragment in my ClojureScript application:

(dom/img #js {:className "img-circle" :src "data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" :style "width: 140px; height 140px;" :alt "Generic Placeholder Image"})

This "explodes" and stops the entire rendering of the entire page!

I think the reason is related to the way React.js handles styles. According to Inline Styles :

In React, inline styles are not specified as a string. Instead, they are specified with an object whose key is a version of the camelCased style name and whose value is the style value, usually a string

What are some good ways to solve this problem? I usually don’t like inline styles, but I would like to know how to make this example work.

+7
reactjs inline-styles om clojurescript
source share
1 answer

I found an example in the Om source code that made me try this, which works:

  (dom/img #js {:className "img-circle" :src "data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" :style #js {:width "140px" :height "140px"} :alt "Generic Placeholder Image"})
+8
source share

More articles:


All Articles