I want to open a window after clicking the fshare:
My render()
return is like this
<Modal.Footer>
<img src="/static/img/fshare.png" onClick={this.fbShare} />
<Button onClick={this.hide}>Close</Button>
</Modal.Footer>
I am creating a function
fbShare: function(event) {
},
And I want to add the following code inside the function that basically opens a new window to share in Facebook:
window.open('https://www.facebook.com/dialog/feed?app_id=xxxxxxxxe='sharer', 'toolbar=0,status=0,width=548,height=325');" target="_parent" href="javascript: void(0)">
But I am confused with how to handle this event.
To use the addEventListener method in function components in React: Set the ref prop on the element. Use the current property on the ref to get access to the element. Add the event listener in the useEffect hook.
To add the click event in React using plain JavaScript, you need to use addEventListener() to assign the click event to an element. Create one <button> element as ref props so that it can be accessed to trigger the click event.
You are on the right way!
Is it something you need? I prepared the example: click here
var Example = React.createClass({
fbShare: function() {
window.open('http://www.facebook.com/sharer.php?s=100&p[title]=Fb Share&p[summary]=Facebook share popup&p[url]=javascript:fbShare("http://jsfiddle.net/stichoza/EYxTJ/")&p[images][0]="http://goo.gl/dS52U"', 'sharer', 'toolbar=0,status=0,width=548,height=325');
},
render: function() {
return (<div>
<img src="http://pasadenainstitute.com/fb-shareTransp122x42.png" onClick={this.fbShare} />
</div>);
}
});
ReactDOM.render(
<Example />,
document.getElementById('container')
);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With