小编Fer*_*o B的帖子

我正在使用带有React的animate.css库,并试图在悬停时设置一个元素(按钮).试图通过文档和这里查看,但无法找到实现这个简单任务的方法.如果有人已经实现了这个或发现参考将非常感激

class App extends Component {

   constructor(props) {
    super(props);

    this.handleHover = this.handleHover.bind(this);
  }

  handleHover(){
    this.setState({
        isHovered: !this.state.isHovered
    });
  }

  render() {
    const btnClass = this.state.isHovered ? "pulse animated" : "";

    return (
      <div>
        <button className={btnClass} onMouseEnter={this.state.handleHover} onMouseLeave={this.state.handleHover}>Test</button>
      </div>
    );
  }
}

export default App;

我正在使用bootstrap 4导航栏,并希望在ig 400px向下向下滚动后更改背景颜色.我正在查看反应文档并找到了一个onScroll但却找不到那么多信息.到目前为止我有

我不知道我是否正在使用正确的事件监听器或如何设置高度等.

我并没有真正设置内联样式

  import React, { Component } from 'react';

   class App extends Component {

   constructor(props) {
    super(props);

      this.state = {  scrollBackground: 'nav-bg' };
      this.handleScroll = this.handleScroll.bind(this);
   }


   handleScroll(){
      this.setState ({
         scrollBackground: !this.state.scrollBackground
       })
    }

 render() {
 const scrollBg = this.scrollBackground ? 'nav-bg scrolling' : 'nav-bg';

 return (
   <div>

       <Navbar inverse toggleable className={this.state.scrollBackground} 
                                  onScroll={this.handleScroll}>
        ...
      </Navbar>

    </div>
   );
  }
}

export default App;