1

我已经设置了哨兵,它可以正常工作并正确发送错误,目前我正在使用报告反馈按钮制作“出现问题的页面”,问题是单击按钮时模式不会弹出,这是代码:

index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, browserHistory } from 'react-router';

import log from 'loglevel';

import { ApolloProvider } from 'react-apollo';

import ConnectedIntlProvider from './ConnectedIntlProvider';

import GoneWrong from './components/errors/GoneWrong';
import apolloClient from './apollo/apolloClient';
import routes from './route';
import Raven from 'raven-js';
log.setDefaultLevel('trace');

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      error: null,
      errorInfo: null
    };
  }

  componentDidCatch(error, errorInfo) {
    // Catch errors in any child components and re-renders with an error message
    this.setState({
      error,
      errorInfo
    });
    Raven.captureException(error, { extra: errorInfo });
    //Raven.showReportDialog();
  }

  render() {
    if (this.state.error) {
      // Fallback UI if an error occurs
      return <GoneWrong />;
    }
    // component normally just renders children
    return this.props.children;
  }
}

ReactDOM.render(
  <ApolloProvider client={apolloClient}>
    <ConnectedIntlProvider>
      <ErrorBoundary>
        <Router history={browserHistory} routes={routes} />
      </ErrorBoundary>
    </ConnectedIntlProvider>
  </ApolloProvider>,
  document.getElementById('root')
);

以下是 GoneWrong 页面中包含 onClick 事件的按钮代码:

<button
  className="button button--blue"
  onClick={() => Raven.lastEventId() && Raven.showReportDialog()}
>

请注意 GoneWrong 页面确实呈现正确,唯一的问题是按钮 onClick。

4

0 回答 0