Warning: FindNodeDom is deprecated in Strictmode when using Collapse (from react-bootstrap)

Viewed 154

I am having an issue with this code in my React project. It would show a div with a warning about filenames to upload.

<Collapse in={this.state.open} id={"z-hover"}>
   <div>
     <ul>
       { FilesAllowed.files.map((fileName, index) => {
         return <li key={index}>{fileName}</li>
       })}
     </ul>
   </div>
</Collapse>

I use a button to display the Collapse element (from react-bootstrap), but when the Collapse gets displayed, console returns this error (I can confirm it comes exactly from the Collapse element):

 findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Transition which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node

Edit: I put my functional code over here in codesandbox.

how could we do to avoid this warning? Thank you for reading:)

0 Answers
Related