asked on October 3, 2017
Hi flexmonster team,
I'm trying to integrate the component within a reactjs application that is build using webpack. I could not find any tutorials for this. As of now I have <script src="../flexmonster/flexmonster.js" type="text/javascript"></script> within my index.html file, but running
<FlexmonsterReact.Pivot report="https://cdn.flexmonster.com/reports/report.json" licenseKey="[trial license]" />
in the html within a component is not working with error: Uncaught ReferenceError: FlexmonsterReact is not defined. Is there an import I need to make? Please advise when you can.
Thanks,
Jordan
UPDATE:
I was able to get the component to render by pulling https://github.com/flexmonster/pivot-react/blob/master/ES6/app/containers/HomePage/flexmonster.react.js and importing it into the file. However, the images are not rendering properly with dropdown icons appearing in the middle of the screen. When I inspect the components it looks like the tabs are making an href with javascript void(0). Any idea how to fix this? I'm linking the stylesheet in my index.html.
⋅ October 4, 2017
Hello Jordan,
Thank you for interest in our component. Please make sure that your Flexmonster object should have the componentFolder property defined correctly. It should be set with the reference on the Flesmonster component folder. Here is the example - https://github.com/flexmonster/pivot-react/blob/master/ES6/app/containers/HomePage/index.js.
Please let us know if you have any additional questions here.
Best regards,
Dmytro.
