I am using the semantic-ui framework for React.
I’m currently looking to create a custom renderer to display some data using the component from semantic.
This is JSX, not HTML, and I’m wondering if it’s possible to render a react UI component in a custom renderer? IF so, how?
Hey @mhennessy7
Handsontable for React 3.1.0 introduced
a possibility to use React components as Handsontable renderers and editors
src Release 3.1.0 · handsontable/react-handsontable · GitHub
Here’s a demo that should help Column component - React Data Grid | Handsontable
Thanks, I missed this before, this is exactly what I was looking for.
A quick follow up question. When using , what is the correct way to pass additional data to the custom renderer? For example, If I want to pass an array of data (for custom selection renderer), do I just add an new attribute to such as
<HotColumn source=[{“id”: “1”, “Label”: “Mark”},{“id”: “2”, “Label”: “Steve”}]>
and then access this in the renderer via the cellproperties.source ?
Or should i put this as an attribute of the custom render itself and use react props to access it?
Thx again
Hi again, so I figured this out, looks like I can just pass in the data via a prop on the custom component.
I’m now running into an issue where the actual behavior of the component isn’t working within the grid?
Here is a link to the semantic Dropdown component I’m looking to use:
https://react.semantic-ui.com/modules/dropdown/#types-multiple-selection
i have this configured in a custom Editor, and I’ve setup up some default options. The drop down appears correctly, however, the behavior of selecting multiple isn’t working. If I use the drop down in a react page, it works fine, but inside the grid, when I make a selection, it doesn’t put the selection at the top of the list or otherwise let me select multiple.
Could you have one of your react developers see how/if this could work?
Hey @mhennessy7
I saw that our Sales Manager already introduced us on emails so I guess we can close this topic.