Mui-datatables: Function components cannot be given refs.

[rofiuddin15]

My Environment

| Tech | Version |
|--------------|---------|
| Material-UI | 4.1.2 |
| MUI-datatables | 2.6.1 |
| React | 16.8.6 |
| browser | chrome |
| etc | |

I have warning when I try to use mui-datatable in my project. like this:

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()? index.js:1375 

Check the render method of `WithStyles(Tooltip)`.
    in Tooltip (created by WithStyles(Tooltip))
    in WithStyles(Tooltip) (created by t)
    in t (created by t)
    in span (created by t)
    in div (created by t)
    in div (created by ForwardRef(Toolbar))
    in ForwardRef(Toolbar) (created by WithStyles(ForwardRef(Toolbar)))
    in WithStyles(ForwardRef(Toolbar)) (created by t)
    in t (created by t)
    in t (created by WithStyles(t))
    in WithStyles(t) (created by r)
    in r (created by t)
    in div (created by ForwardRef(Paper))
    in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
    in WithStyles(ForwardRef(Paper)) (created by t)
    in t (created by WithStyles(t))
    in WithStyles(t) (at ListView.jsx:19)
    in ListView (created by Context.Consumer)
    in Route (at Layout/index.jsx:17)
    in Switch (at Layout/index.jsx:14)
    in main (at Layout/index.jsx:52)
    in div (at Layout/index.jsx:40)
    in Layout (created by Context.Consumer)
    in Route (at App/index.js:13)
    in Router (at App/index.js:12)
    in App (at src/index.js:7)

[gabrielliwerant]

Try reducing your material-ui version to 3.5.1. The latest is not yet supported by this library.

[sswapnil2]

Tried removing tooltip from Toolbar component

I tried removing Tooltip component from Toolbar Component inside mui-datatables library. I found that react-to-print props trigger takes function component as input and we cannot forward ref there.

When i removed Tooltip everything was working fine. I didn't run test tough to check if anything else was breaking.

[briceamk]

Tried removing tooltip from Toolbar component

I tried removing Tooltip component from Toolbar Component inside mui-datatables library. I found that react-to-print props trigger takes function component as input and we cannot forward ref there.

When i removed Tooltip everything was working fine. I didn't run test tough to check if anything else was breaking.

How to remove Tooltip please

[sswapnil2]

If you don't need print functionality, just add print: false to options. You won't get that warning again

[gabrielliwerant]

I think this was fixed by a round of improvements that enhance support for mui v4, so closing this unless the issue crops up again.