React 无法识别 DOM 元素上的 `enterKeyHint` 道具

Fai*_*ire 1 react-native styled-components

一个实现样式化组件和滚动视图的 react-native 应用程序正在运行,但给了我这个警告:

index.js:1 Warning: React does not recognize the `enterKeyHint` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `enterkeyhint` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in input (created by TextInput)
    in TextInput (created by Context.Consumer)
    in StyledNativeComponent (created by Styled(TextInput))
    in Styled(TextInput) (at Signup.js:96)
    in div (created by View)
    in View (created by ScrollView)
    in div (created by View)
    in View (created by ForwardRef)
    in ForwardRef (created by ScrollView)
    in ScrollView (at Signup.js:95)
Run Code Online (Sandbox Code Playgroud)

这是组件的渲染:

 return (
        <BasicView>
            {isLoading && <Preloader/>}
            <ScrollView>
      LOC 96 -> <BasicInput placeholder="email" value={email} onChangeText={(val) => setEmail(val)}/>
                <BasicInput placeholder="password" value={password} onChangeText={(val) => setPassword(val)}
                            maxLength={15} secureTextEntry={true}/>
                <BasicInput placeholder="name" value={displayName} onChangeText={(val) => setDisplayName(val)}/>
                <Button title="Signup" onPress={() => registerUser()}/>
                <BasicLink onPress={() => props.navigation.navigate(NavigationLocations.LOGIN)}>
                    Already registered? Click here to log in...
                </BasicLink>
            </ScrollView>
        </BasicView>
    )
Run Code Online (Sandbox Code Playgroud)

这是样式组件的定义:

export const BasicInput = styled.TextInput`
    width: 100%;
    margin-bottom: 15px;
    padding-bottom: 15px;  
    align-self: center;
    border-color: #ccc;
    border-bottom-width: 1px;
`;
Run Code Online (Sandbox Code Playgroud)

什么是enterKeyHint指什么?我应该实施什么更正?

小智 6

问题来自 React Native Web。不确定在哪个版本中出现。无论如何,我回到了 0.12.3 版,我再也没有收到此警告。

enterKeyHint 是用于虚拟键盘的 html 属性。这是一种重命名 [ENTER] 键的方法。 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/enterKeyHint

该警告不会出现在 Andoid 或 iOS 上。因此,如果您不愿意降级 React Native Web 版本,则可以放心地忽略此警告,因为您很可能不需要重命名 Web 上虚拟键盘上的 [ENTER] 键。