javascript - How to use eventlisteners and functions from outside react components? -
i have loaded library (cordova) in main index.html file. added eventlistener 'deviceready' on document. how can call function , related library inside react component?
html file:
<!doctype html> <html> <head> <title>title</title> </head> <body> <div id="app"></div> </body> <script type="text/javascript" src="cordova.js"></script> <script> document.addeventlistener('deviceready', ondeviceready); // function want call inside component. // function ondeviceready() { // var rect = { x: 0, y: 0, width: window.innerwidth, height: window.innerheight }; // cordova.plugins.camerapreview.startcamera(rect, 'back', true, true, true) // cordova.plugins.camerapreview.show(); // } </script> </html>
my react component:
import react, { component } 'react'; class example extends component { // here want call cordova actions inside eventlistener render() { return ( <div> <p>example</p> </div> ); } } export default example;
by using reacjs lifesycle proper way add , remove events
so can this:
import react, { component } 'react'; class example extends component { componentdidmount() { document.addeventlistener('deviceready', this.deviceready); } componentwillunmount() { document.removeeventlistener('deviceready', this.deviceready); } deviceready () { // stuff } render() { return ( <div> <p>example</p> </div> ); } } export default example;
Comments
Post a Comment