Topic: Warning: React does not recognize the `isOpen` prop on a DOM element.
master@mastersistemas.net pro asked 6 years ago
<SideNav isOpenWithButton={isOpenWithButtonA} breakWidth={991} className={this.props.color}> <img src={logo} alt="Logo" className="ml-5 mt-4"></img> <SideNavNav> <div className="col-lg-12"> <form className="form-inline md-form form-sm"> <i className="fa fa-search" aria-hidden="true"></i> <input className="form-control form-control-sm ml-3 w-75 input-search white-text" type="text" placeholder="Pesquise..." /> </form> </div> <Link className="mt-3" to={Front + '/financeiroMenu'}><h4 className="grey-text"> Home</h4></Link> <SideNavCat name="Cadastro" onClick={this.onClick} isOpen={this.state.accordionSideNav === 0}> <Link to={Front + '/financeiroLancamento'}> Lançamento</Link> <Link to={Front + '/financeiroBanco'}>Banco</Link> <Link to={Front + '/financeiroPagamento'}>Forma de Pagamento</Link> <Link to={Front + '/financeiroCondicao'}>Condição de Pagamento</Link> </SideNavCat> <SideNavCat name="Consultas" onClick={this.onClick1} isOpen={this.state.accordionSideNav === 1}> <SideNavItem>LIVRO Caixa</SideNavItem> <SideNavItem>FLUXO Caixa</SideNavItem> </SideNavCat> <SideNavCat name="Sobre" onClick={this.onClick2} isOpen={this.state.accordionSideNav === 2}> <SideNavItem>Instruction</SideNavItem> <SideNavItem>Monthly meetings</SideNavItem> </SideNavCat> <SideNavCat name="Ajuda" onClick={this.onClick3} isOpen={this.state.accordionSideNav === 3}> <SideNavItem>FAQ</SideNavItem> <SideNavItem>Write a message</SideNavItem> </SideNavCat> </SideNavNav> </SideNav>Warning:
index.js:2178 Warning: React does not recognize the `isOpen` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `isopen` instead. If you accidentally passed it from a parent component, remove it from the DOM element. in div in Manager in Dropdown (at SideNavbar.js:218) in li in NavItem (at SideNavbar.js:217) in ul in NavbarNav (at SideNavbar.js:216) in nav in Navbar (at SideNavbar.js:187) in div (at SideNavbar.js:186) in div (at SideNavbar.js:151) in SideNavBar (created by Route) in Route (created by withRouter(SideNavBar)) in withRouter(SideNavBar) (at FinanceiroMain.js:44) in div (at FinanceiroMain.js:43) in div (at FinanceiroMain.js:42) in Router (created by BrowserRouter) in BrowserRouter (at FinanceiroMain.js:41) in div (at FinanceiroMain.js:40) in MainFinanceiro (created by Route) in Route (at Main.js:29) in Switch (at Main.js:20) in div (at Main.js:19) in Main (at App.js:6) in div (at App.js:5) in App (at index.js:13) in Router (created by BrowserRouter) in BrowserRouter (at index.js:12)
Delgermaa Sanjjav answered 4 years ago
i got solved this issue. just change tag to Navlink because ActiveClassName is just suported Navlink.
stephenr pro answered 6 years ago
yujanrichie answered 6 years ago
Double Navigation with hidden SideNav & fixed Navbar
I think it's pointing to the "isOpen" prop passed to the Dropdown component. Following the suggestion and changing it to "isopen", I get this: Warning: Received `false` for a non-boolean attribute `ispen`. If you want to write it to the DOM, pass a string instead: ispen="false" or ispen={value.toString()}.Jakub Mandra staff premium answered 6 years ago
master@mastersistemas.net pro answered 6 years ago
index.js:2178 Warning: React does not recognize the `isOpen` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `isopen` instead. If you accidentally passed it from a parent component, remove it from the DOM element. in a (created by t) in t (created by t) in t (created by d) in d (created by t) in t (at App.js:86) in ul (created by t) in li (created by t) in t (at App.js:85) in ul (created by t) in div (created by t) in Unknown (created by t) in t (created by t) in div (created by t) in t (at App.js:83) in div (at App.js:45) in Router (created by BrowserRouter) in BrowserRouter (at App.js:44) in App (at index.js:11) This is the line he accuses. https://ibb.co/dBgCVK I have another question in the forum that is showing "Click" on the console. I've been warned, it's a versioning bug, so the "isOpen" problem might be related to the same reason? https://mdbootstrap.com/support/react/appearing-click-on-the-console/
master@mastersistemas.net pro commented 6 years ago
It is confusing to edit texts in your forum, could follow the git patternJakub Mandra staff premium answered 6 years ago
in a (created by t) in t (created by t)I see that you also use Navbar, so maybe you have Dropdown with isOpen prop somewhere? Regards, Jakub
master@mastersistemas.net pro commented 6 years ago
Hello, I have already checked all the code and nowhere do I use "isOpen. I will wait for the update on day 10 to see if it resolves.master@mastersistemas.net pro commented 6 years ago
Good morning, I updated my package today, but I continue with the "isOpen" alert, how can I solve this?stephenr pro answered 6 years ago
Jakub Mandra staff premium answered 6 years ago
netnovation18 pro answered 6 years ago
Jakub Mandra staff premium commented 6 years ago
Hi there, We will address this problem in this iteration (will be released in 2 weeks from now). Regards, JakubJakub Mandra staff premium commented 6 years ago
For now you have to use SideNavCat as a wrapper...netnovation18 pro commented 6 years ago
Really? Yeah i see the problem now... If i use sidenavcat the problem is gone but i dont want that, im gonna wait for the update to see it, thanks!Jakub Mandra staff premium commented 6 years ago
Problem has already been solved, solution will be out within release in next Monday. Regards, JakubJakub Mandra staff premium answered 6 years ago
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB React
- MDB Version: 4.7.1
- Device: NO
- Browser: NO
- OS: NO
- Provided sample code: No
- Provided link: No