Getting Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()? Check the render method of `ForwardRef(Tooltip)`

6414

I started getting the below warning when i use Tooltip in my react application,

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

Check the render method of `ForwardRef(Tooltip)`

I'm using a simple Tooltip as shown below

<Tooltip title="Search">
  <Link route="/search">
    <SearchIcon />
  </Link>
</Tooltip>

2 Answers

3 years ago by

@Anusha, can you please post the code you are using?

3 years ago by Karthik Divi

I had encountered similar type of issue. I have used <IconButton> instead of <Link> which solved my issue like below.

  <Tooltip title="Search">
      <IconButton aria-label="search" onClick={() => Router.pushRoute(`/search`)}>
          <SearchIcon />
      </IconButton>
  </Tooltip>
3 years ago by Divya