React 无法识别 DOM 元素上的“activeKey”(和“activeHref”)props

IT技术 reactjs typescript dom
2021-05-08 20:53:42

我一直在我的 React Web 应用程序上收到此警告,但不确定如何解决此问题。我对 React 还很陌生,并尝试通过谷歌搜索,但仍然没有找到解决方案。

Warning: React does not recognize the `activeKey` prop on a DOM element. If 
         you intentionally want it to appear in the DOM as a custom 
         attribute, spell it as lowercase `activekey` instead. If you 
         accidentally passed it from a parent component, remove it from the 
         DOM element.
    in div (created by NavbarForm)
    in NavbarForm (created by Header)
    in ul (created by Nav)
    in Nav (created by Header)
    in div (created by Grid)
    in Grid (created by Navbar)
    in nav (created by Navbar)
    in Navbar (created by Uncontrolled(Navbar))
    in Uncontrolled(Navbar) (created by Header)
    in Header (created by App)
    in div (created by App)
    in App

这是我的标题的代码

import * as React from 'react';
import { Button, FormControl, FormGroup, Nav, Navbar, NavItem} from 'react-bootstrap';

const Header = (props : any) => {
    return (
        <Navbar>
            <Navbar.Header>
                <Navbar.Brand>
                    <NavItem href="/">
                        RedQuick
                    </NavItem>
                </Navbar.Brand>
            </Navbar.Header>
            <Nav>
                <Navbar.Form>
                    <form onSubmit={ props.getRedditPost }>
                        <FormGroup>
                            <FormControl 
                                type="text" 
                                name="subreddit" 
                                placeholder="Subreddit Name..." 
                            />
                        </FormGroup>
                        <Button type="submit">Search</Button>
                    </form>
                </Navbar.Form>                
            </Nav>
        </Navbar>
    );
};

export default Header;

如果不是标题问题,则链接到 Github 存储库

1个回答

一个网络搜索找到了我这个问题,这表明,把<Navbar.Form>里面<Nav>是无效的。查看文档中的示例,可能只需删除<Nav>.