Fork me on GitHub
kay un06:07:59

Hi, iā€™m working with reagent & antd table(, 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.)

kay un15:07:21

@U2FRKM4TW that works. thank you so much. need to learn more about JS interop

šŸ‘ 3

Has anyone used react-virtualized with reagent? I'm trying to follow this ( 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)
   [:> Column {:label "Nome" :dataKey :name_pt :width 500}]]
And I can see that the items are in the DOM, but no text is rendered on the screen. If I open the console and scroll I can see the rowGetter function being called and the data is fine, but nothing shows up on the screen. I think it might be the dataKey, but I've tried :name_pt, "name_pt" and ":name_pt" and none work. Any insight?


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.