reactjs - 尝试设置输入属性时反应useRef返回未定义的错误

Question

我已经使用了来自 react 的 useRef 钩子

const myInput = useRef()

并将其传递给 material-ui OutlinedInput 组件

<OutlinedInput
  id="outlined-adornment-amount"                                      
  inputRef={myInput}
  type="file"                                            
  startAdornment={<InputAdornment position="start">
                   <FolderIcon fill="#333" />
                    </InputAdornment>}
                      labelWidth={60}
    />

当我尝试在 useEffect 中设置输入的属性时

  useEffect(() => {
        myInput.current.directory = true
    }, [])

我明白了

未捕获的类型错误：无法设置未定义的属性“目录”

Answer 1

我看不出你的代码有任何问题。我测试过，一切正常。看看这个：

https://codesandbox.io/s/hardcore-kare-u5rgm

Answer 2

我有完全相同的问题。在我的项目中，有几个 MUI 组件，并且输入在模式上。就我而言，有效的是使用超时。不确定这是否是最好的解决方案，但它有效：

  const myInputRef = useRef();
....
  useEffect(() => {
    setTimeout(() => {
      myInputRef.current.focus();
    }, 0);
  }, []);