Question

尝试设置输入属性时，React useRef 返回未定义的错误

2021-01-15

1166

reactjs react-hooks use-ref

我已经使用了 react 中的 useRef hook

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
    }, [])

我得到了

Uncaught TypeError: Cannot set property 'directory' of undefined

Answer 1

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

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

Answer 2

我遇到了完全相同的问题。我的项目中有多个 MUI 组件，输入位于模态框中。就我而言，有效的方法是使用超时。不确定这是否是最好的解决方案，但它确实有效：

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

Answer 3

可能是因为您使用的输入实际上不是输入。我认为如果您记录您的参考，您将有 2 个子项。

Mohamadreza Kazemian

2022-12-08