Clojurians Log v2
reagent
Hi, iām working with reagent & antd table(http://ant.design/components/table/#components-table-demo-head), the UI works fine but how to define the javascript function for sorter prop in reagent: (a, b) => a.age -b.age ?
Any ClojureScript function is a JavaScript function. Just use JS interop so e.g. a.age becomes (.-age a). Also make sure to add ^js in front of such symbols' definitions to prevent them from being mangled by GCC during advanced optimizations.
(Unless you need them to be mangled - depends on your code and on how the table works, I suppose.)
@p-himik that works. thank you so much. need to learn more about JS interop
Has anyone used react-virtualized with reagent? I'm trying to follow this (https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md) example with the following code
(defn materialized-table
[]
[:> Table {:width 300
:height 300
:headerHeight 20
:rowHeight 30
:rowCount (count movies)
:rowGetter (fn [index] (let [movie (get movies (aget index "index"))]
(println movie)
movie))}
[:> Column {:label "Nome" :dataKey :name_pt :width 500}]]
)I don't know if there's something wrong in your case, but FWIW, as per the "A word about react-window" from the react-virtualized's README, I have switched to react-window along with react-virtualized-auto-sizer, and it has been a smooth sailing.
I also had some issues with react-virtualized which prompted me to switch, although I don't think it was anything similar to your case.
I'm trying to use this along with material-ui and since my knowledge of frontend/javascript is very bad, I'd rather not stray away from the examples š
But yeah, maybe it's related to that
Material UI has an example with react_window for lists, but it's not really what I want
The issue with examples is that they become outdated all the time - you may get something working with them, but you won't get too far. Unless, of course, building this one thing is all you want.
IIRC, in react-window a list and a table almost don't differ. They both have the same functionality at their core, and the API is mostly identical.