Using Viewer Events
Our sample projects and report templates can help you learn the basics of working with our products.The React viewer exposes events as component props. This example handles the e-mail event, which fires when the user sends a report from the toolbar.
Viewer setup. Configure the viewer, load the report, assign it to the component, and process the requests or events raised by the UI.
Viewer setup. Configure the viewer, load the report, assign it to the component, and process the requests or events raised by the UI.
import { Viewer, Stimulsoft } from 'stimulsoft-reports-js-react/viewer';
function onEmailReport(args: Stimulsoft.Viewer.EmailReportArgs) {
alert(`Email: ${args.settings.email} File name: ${args.fileName}`);
}
function App() {
var report = new Stimulsoft.Report.StiReport();
report.loadFile('Reports/SimpleList.mrt');
var viewerOptions = new Stimulsoft.Viewer.StiViewerOptions();
viewerOptions.toolbar.showSendEmailButton = true;
return <Viewer options={viewerOptions} report={report} onEmailReport={onEmailReport} />;
}on<Event>; here onEmailReport receives the e-mail settings and file name. The same pattern handles print, export, interaction and design events by adding the corresponding prop.