Adobe React-Spectrum TextField使用refs错误

Question

大家好，

我正在尝试使用Adobe的反应谱构建一个登录页面。我需要在TextField组件上使用userefs，因为我将需要它用于我的AuthenticationContext。他们的文档没有详细说明refs的用途。我也检查了DefinitelyTyped关于这个问题的页面，但没有运气。如有任何帮助，不胜感激。

下面的代码:

const LoginForm = () => {
const emailRef = useRef() as React.MutableRefObject<HTMLInputElement>
const passwordRef = useRef() as React.MutableRefObject<HTMLInputElement>
.
.
.
<Form isRequired necessityIndicator="label">
<TextField
label="email"
placeholder="[e-mail]"
isRequired
value={email}
onChange={setEmail}
ref={emailRef}
/>
<TextField
label="Password"
placeholder="Password"
isRequired
type="password"
value={password}
onChange={setPassword}
ref={passwordRef}
/>
<Button variant="cta" onPress={LogIn} marginTop="5%">
Log In
</Button>
</Form>

Answer 1

first import TextFieldRef

import TextFieldRef from '@react-types/textfield'

在main函数/hook中

const passwordRef = React.useRef<TextFieldRef.TextFieldRef>(null)

<TextField
ref={passwordRef}
/>

on other function

if(passwordRef && passwordRef.current) {
passwordRef.current.getInputElement().focus()
}