title: ref.current.setAttribute is not a function
body: <p><a href="https://codesandbox.io/s/react-16-2fss1" rel="nofollow noreferrer">https://codesandbox.io/s/react-16-2fss1</a></p>
  
  <pre><code>import React, { useRef, useEffect } from "react";
  import { render } from "react-dom";
  import Autosuggest from "react-autosuggest";
  
  const styles = {
    fontFamily: "sans-serif",
    textAlign: "center"
  };
  
  const Wrapper = () =&gt; {
    const inputRef = useRef();
  
    useEffect(() =&gt; {
      if (typeof inputRef.current !== "undefined") {
        inputRef.current.setAttribute("de-di-var", "");
      }
    }, []);
  
    return &lt;App ref={inputRef} /&gt;;
  };
  const inputProps = {
    placeholder: "",
    value: "",
    onChange: (event, { newValue }) =&gt; {
      console.log("change");
    },
    label: "",
    feedback: null,
    error: null
  };
  const App = React.forwardRef(
    ({ error }, ref) =&gt; {
      return (
        &lt;div style={styles}&gt;
          &lt;h4&gt;Reference&lt;/h4&gt;
          &lt;Autosuggest
            inputProps={inputProps}
            ref={ref}
            suggestions=""
            undefined={false}
          /&gt;
        &lt;/div&gt;
      );
    }
  );
  
  render(&lt;Wrapper /&gt;, document.getElementById("root"));
  </code></pre>
  
  <p>Ok, so I am trying to use a ref in my wrapper component and then use the function setAttribute to add an attribute to the input field inside the component Autocomplete, but it won't let me. Is there any reason for this, because I am struggling to figure out why ref.current may be undefined, because that's what I am assuming I get the message error.</p>