<Link> onClick 反应通知未显示，但它运行该功能答案

【问题标题】：<Link> onClick react-notifications not showing, but it runs the function<Link> onClick 反应通知未显示，但它运行该功能
【发布时间】：2021-05-27 11:05:51
【问题描述】：

我创建了一个调查页面，但是当有人没有积分时，我想使用 react-notifications 向用户显示通知，我已经测试了该按钮并且独立它可以工作，但是当我将它添加到在 onClick 事件上使用 react-router-dom 标记，函数运行，但通知不出现。代码如下：

import React, { Component } from 'react';
import 'react-notifications/lib/notifications.css';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import {NotificationContainer, NotificationManager} from 'react-notifications';

class Button extends Component {
  createNotification = () => {
    return () => {
      switch (this.props.auth.credits) {
        case 0:
          console.log(this.props.auth.credits);
          NotificationManager.error('You have no credits', 'Click to close!', 5000, () => {
          });
          break;
      }
    };
  };

  render() {
    return (
      <div>
        <div  className="fixed-action-btn">
          <Link to="/surveys/new" className="btn-floating btn-large red" onClick={this.createNotification()}>
            <i className="material-icons">add</i>
          </Link>
        </div>
        <NotificationContainer/>
      </div>
    );
  }
}

function mapStateToProps({ auth }){
  return { auth };
}

export default connect(mapStateToProps)(Button);

所以，当我对此进行测试时：

import React from 'react';
import Surveys from './surveys/Surveys';
import Button from '../utilities/addButton';


const Board = () => {
  return (
    <div>
      <Surveys />
      <Button />

    </div>
  );
};

export default Board;

它显示了按钮，当点击时没有积分，它控制台记录了 0 个积分，但是，它只是重定向到引用的页面而不显示创建的通知。

就我而言，它在终端、控制台或网络中都没有出现错误。但是，通知仍在处理中，但未显示。

所以我的问题是：是否可以在标签重定向到新页面时显示通知，如果不可能，我看到解决方案的唯一方法是有条件地停止进行更改的标签，我错了吗？

提前致谢。抱歉，如果我的问题没有正确提出或书写，这是我的第一个问题。

【问题讨论】：

标签： javascript reactjs react-router react-router-dom react-notifications

【解决方案1】：

onClick 属性为 Link 接受函数参考。所以尝试替换

 <Link to="/surveys/new" className="btn-floating btn-large red" onClick={this.createNotification}>
     <i className="material-icons">add</i>
 </Link>

【讨论】：

很抱歉，刚刚测试了它，这对我不起作用，它也停止制作 console.log。

【解决方案2】：

这可能是一个非常晚的回复，但对于那些因为链接不接受 onCLick 而没有回答的人...尝试 html 或使用 react 或 reactbootstrap 包

【讨论】：