How to convert a React Element to an Html element?

Question

Now I use ag-grid, which can create a custom renderer for each data cell, but this requires HTML elements

For example, these are elements that can be created by calling document.createElement ()

But I want to use the React element as a custom renderer for convenient

Not sure if I can do this or not?

Answer 1

You can try using getDOMNode , for example: this.refs.giraffe.getDOMNode() or:

 import ReactDOM from 'react-dom'; ... const submitBtn = ReactDOM.findDOMNode(this.refs.submitButton) 

But in this case there are some problems with obsolete ones, more here: React.js: difference between findDOMNode and getDOMNode

Answer 2

There is a new React method in ag-grid for this. This is very recent, so you should update the ag-grid module. Instead of using cellRenderer use cellRendererFactory to which you can directly pass the React component. Source: https://www.ag-grid.com/javascript-grid-cell-rendering-components/#react-cell-rendering