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

CodePudding user response：

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.