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