I want to change the text color of the navlink on scroll by assigning it to an onScroll method. But it still wont change color.

It doesn't change the text color unless i do inline " style={{'color':'black'}}.

import React from 'react'; import { MDBNavbar, MDBNavbarBrand, MDBNavbarNav, MDBNavbarToggler, MDBCollapse, MDBNavItem, MDBNavLink, MDBContainer, MDBMask, MDBView } from 'mdbreact'; import './Styles.css' import { MDBBtn } from "mdbreact";

import { MDBCarousel, MDBCarouselInner, MDBCarouselItem } from "mdbreact";

import HomeComponent from './components/HomeComponent' import AboutComponent from './components/AboutComponent'

class Navbar extends React.Component { constructor(props) { super(props); this.state = { collapse: false, isWideEnough: false, }; this.onClick = this.onClick.bind(this); }

onClick() { this.setState({ collapse: !this.state.collapse, }); } handleScroll(){ this.setState({ color:'black', }); }

render() { return ( Medishop {!this.state.isWideEnough && } {/* /} Home About Medicines Contact {/ */} Login Register Logout ); } }

export default Navbar;