小编ata*_*ksy的帖子

我正在寻找一种方法来更改滚动时的导航栏颜色（CSS 中的 .bg-light），但我找不到方法。我想实现一个代码，以便每当用户从某个 y 点向下滚动时，导航栏样式就会改变；每当用户向上滚动到该点时，它就会回到原来的样式。

这是我的导航栏组件。有什么建议么？

import React, { useState} from 'react';
import './Navbar.css';
import Navbar from 'react-bootstrap/Navbar'
import Nav from 'react-bootstrap/Nav'
import { Link, animateScroll as scroll } from "react-scroll";

const navbar = (props) =>  {

    return (
        <div>
        <Navbar bg="light" expand="sm" fixed="top">
            <Navbar.Brand href="#home">
                KuGPA
            </Navbar.Brand>
            <Navbar.Toggle aria-controls="basic-navbar-nav" />
            <Navbar.Collapse id="basic-navbar-nav ">
                    <Nav.Link className="ml-auto"/>
                    <Link to="HOME" smooth={true} duration= {500}>
                        <Nav.Link  href="#HOME">Home</Nav.Link>
                    </Link>

                    <Link to="KUGPA" smooth={true} duration= {500}>
                    <Nav.Link  href="#KUGPA">KuGPA</Nav.Link>
                    </Link>


                    <Link to="ABOUT" smooth={true} duration= {500}>
                    <Nav.Link href="#ABOUT">About</Nav.Link>
                    </Link> …