Closed leopucci closed 3 years ago
This error is frequently seen when creating a function inside a React.js component. It happens because of an incorrect binding of this. Sometimes the scope is not setup correctly which causes the event object to be undefined.
So, how can you fix the cannout read property preventDefault of undefined error? This can be fixed by using the following methods
Not executing the function in the callback handler (most likely culprit) Binding the scope correctly with an arrow function Using JavaScript’s .bind() to set the correct scope.
The button works with https://www.npmjs.com/package/react-apple-login Is the responsibility of the apple module to prevent the post submit? Isn't the developer responsibility to prevent this? My button is designed with type='button' to prevent this, so there is no form submit, hence why is the apple module trying to prevent that? I think that can be a module bad design or not, maybe not this module, the button one, but i don´t know. if anybody knows how to fix this on the module side, ideas are welcomed.
Hey @leopucci ! Thanks for the detailed issue!
This is fixed in https://github.com/A-Tokyo/react-apple-signin-auth/pull/62
@leopucci Let me know if the solution is adequate, I simply avoid calling the preventDefault if e
is not defined.
appleAuthHelpers module doesn't change at all, so I think this solution should fix your problem?
Good luck!
@A-Tokyo thanks for your help. It is working properly now. Nice solution, this solves and does not affect/change the actual behavior of the module. Thanks!
Hey there!. Nice job doing this module!
I am trying to use this module with a custom button rendered but I am having problem with the event not being sent to handleClick.
I tried to solve, but even after digging I could not found what is wrong. These two are two examples of detailed explanations around the problem: https://www.jsdiaries.com/how-to-fix-cannot-read-property-preventdefault-of-undefined/ https://stackoverflow.com/questions/51004969/reactjs-cannot-read-property-preventdefault-of-undefined
I tried with simple buttons and everything works ok.
For the buttons i am using this module: https://www.npmjs.com/package/react-social-login-buttons The strange thing is that I use the same button with
react-google-login
module and the button works just fine. So I´m in doubt if it is related toreact-apple-signin-auth
orreact-social-login-buttons
What puzzles me is that i set
onClick={renderProps.onClick}
directly. So how could the module mess with anything? Could anyone point me at some direction? Thanks in advance. Pucci