javascript - 如何在reactstrap的Popovers中正确使用delay?

标签 javascript reactjs reactstrap

我读了Popovers' doc 。我尝试在 Popover 上使用 delay,但延迟不起作用。

我是不是搞错了?

Live version

  constructor() {
    super();

    this.state = {
      popoverOpen: false
    };
  }

  toggle = () => {
    this.setState({
      popoverOpen: !this.state.popoverOpen
    });
  };

  render() {
    return (
     <div>
        <Button id="Popover1" onClick={this.toggle}>
          Launch Popover
        </Button>
        <Popover delay={2000} placement="bottom" isOpen={this.state.popoverOpen} target="Popover1" toggle={this.toggle}>
          <PopoverHeader>Title</PopoverHeader>
          <PopoverBody>Body</PopoverBody>
        </Popover>
      </div>
    );
  }

最佳答案

作为替代方案,如果延迟属性不起作用,您可以随时对 toggle 函数执行此操作

toggle = () => {
 setInterval(() => {
   this.setState({ popoverOpen: !this.state.popoverOpen });
 }, 2000)   
};

关于javascript - 如何在reactstrap的Popovers中正确使用delay?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48366548/

相关文章:

javascript - 浏览器持久滚动位置

javascript - jquery onblur 不触发

javascript - React 点击处理程序不工作并将 ="[object Object]"写入 DOM

reactjs - 使用 Axios 获取 Json 并迭代 ReactStrap Table 中的数据

javascript - ReactJS 主动 NavLink

javascript - 使用jquery调用web服务

javascript - 如何检查授权 token 是否过期并强制注销?

javascript - 如何使用 react 钩子(Hook)重置 setInterval 函数

javascript - 通过 Google Apps 脚本中的 API 组合 GET 和 POST 请求