0

I am not finding preventDefault() in the functions for an event and defaultPrevented:false. So I need to include e.preventDefault(); I am attempting to call event in a asynchronous function, but it should be working the same way as with regular functions.

This is the section of the code involved when passing the event on OnClick:

    const steps=(props,state,handleSave) = [
        {
        title:"Create Application"
        content:(
          <ApplicationForm
            initialValues={props.application}
            onSubmit={handleSave}
          />
        ),
        buttons:[
        <a
          onClick={async (e) => {
            const response = await handleSave(
              e,
              {
                ...props.formValues,
              }
            );
            if (response){
              return props.history.push({
                pathname: `${routes.EDIT_APPLICATION.dynamicRoute(
                 props.application?.application_guid)}`,
              state: { current: 1 },
              });
            }
            return null;
           }}
        >
          Save Application
        </a>
        ]
        
export class ApplicationPage extends Component {
  state={
    current=0,
  }
  
  handleSave = async(e, values) => {
    e.preventDefault(); //Uncaught (in promise) TypeError: e.preventDefault is not a function
    const applicationFound = Boolean(values.application_guid);
    if (!applicationFound){
      return this.handleCreateApplication(values);
    }
    return this.handleUpdateApplication(values);
  };

Do you find any issue on this snippet? This are the attributes included in the event Object passed on onClick:

e: Class
altKey: false
bubbles: true
button: 0
buttons: 0
cancelable: true
clientX: 680
clientY: 241
ctrlKey: false
currentTarget: a
defaultPrevented: false
detail: 1
dispatchConfig: {phasedRegistrationNames: {…}, dependencies: Array(1), eventPriority: 0}
eventPhase: 3
getModifierState: ƒ modifierStateGetter(keyArg)
isDefaultPrevented: ƒ functionThatReturnsFalse()
length: 0
name: "functionThatReturnsFalse"
prototype: {constructor: ƒ}
arguments: (...)
caller: (...)
[[FunctionLocation]]: react-dom.development.js?7f13:8352
[[Prototype]]: ƒ ()
[[Scopes]]: Scopes[3]
isPropagationStopped: ƒ functionThatReturnsFalse()
isTrusted: true
metaKey: false
movementX: 0
movementY: 0
nativeEvent: PointerEvent {isTrusted: true, pointerId: 1, width: 1, height: 1, pressure: 0, …}
pageX: 680
pageY: 241
relatedTarget: null
screenX: -1368
screenY: 198
shiftKey: false
target: a
timeStamp: 1155255.8999999985
type: "click"
view: Window {window: Window, self: Window, document: document, name: '', location: Location, …}
_dispatchInstances: FiberNode {tag: 5, key: null, elementType: 'a', type: 'a', stateNode: a, …}
_dispatchListeners: ƒ (_x)
_targetInst: FiberNode {tag: 5, key: null, elementType: 'a', type: 'a', stateNode: a, …}
[[Prototype]]: Class

Thanks a lot

1 Answer 1

1

The preventDefault method will only be available when handleSave is called by the onSubmit event of ApplicationForm. In the onClick handler of the a tag, preventDefault isn't supposed to be part of the event.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.