1

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

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 积分，但是，它只是重定向到引用的页面而不显示创建的通知。

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

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

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

4

2 回答 2

0

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

于 2021-07-09T02:49:43.620 回答
0

onClickLink接受函数参考的道具。所以尝试更换

 <Link to="/surveys/new" className="btn-floating btn-large red" onClick={this.createNotification}>
     <i className="material-icons">add</i>
 </Link>
于 2021-02-25T10:40:33.677 回答