onPress now has a parameter

onPress now has a parameter, so any code like onPress={this.handlePress} will now have an event parameter passed to it, inducing functions handling button presses like handlePress = (param = 'default value') => {...} are broken.

This is what onPress callback functions now receive:

If this is a planned change, this is definitely breaking. If this is a bug, it is a serious one. I have only tested this on iOS, I have no idea if this also occurs on Android, but I guess it does.

React Native version: System: OS: macOS 10.15.1 CPU: (4) x64 Intel® Core™ i5-7500 CPU @ 3.40GHz Memory: 2.28 GB / 24.00 GB Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.12.0 - /usr/local/bin/node Yarn: 1.19.1 - /usr/local/bin/yarn npm: 6.11.3 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman SDKs: iOS SDK: Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1 Android SDK: API Levels: 23, 24, 25, 26, 27, 28 Build Tools: 23.0.1, 26.0.3, 27.0.3, 28.0.2, 28.0.3 System Images: android-23 | Intel x86 Atom_64, android-23 | Google APIs Intel x86 Atom_64, android-27 | Intel x86 Atom_64, android-27 | Google APIs Intel x86 Atom IDEs: Android Studio: 3.4 AI-183.6156.11.34.5522156 Xcode: 11.2/11B52 - /usr/bin/xcodebuild npmPackages: react: 16.9.0 => 16.9.0 react-native: 0.61.4 => 0.61.4 npmGlobalPackages: react-native-cli: 2.0.1

Steps To Reproduce

1. Create a TouchableOpacity component
2. Add a onPress={this.handlePress} prop
3. Make your handle function like handlePress = (param = 'default value') => {...}

Describe what you expected to happen: Not receiving a parameter from onPress, or saying in the RN0.61 changelog that this is a breaking change.

Snack, code example, screenshot, or link to a repository:

import React, { PureComponent } from 'react';
import { TouchableOpacity } from 'react-native';

class BugReport extends PureComponent {
  handlePress = (param = 'default value') => {
    console.log('This is not "default value", this is an event', param);
  }

  render() {
    return (
      <TouchableOpacity onPress={this.handlePress} />
    );
  }
}

[jacobp100]

Looks like it was added here https://github.com/facebook/react-native/commit/debca6d24f558d985b3d83d54a470628357e0d96 … 4 years ago 😉

[dulmandakh]

Why pass default param if you don’t want to receive event or argument to your function? It can be something like below.

handlePress = () => {
    console.log('This is not "default value", this is an event');
}