Строковая переменная, переданная в функцию как объект класса

Question

В моем собственном приложении реакции есть словарь, в котором я сохранил ключи в массиве, используя this.setState({keys: Object.keys(dict)}). Я пытаюсь перебрать и отобразить эти ключи, которые при нажатии передают имя ключа функции следующим образом:

this.state.keys.map((key, index) => {
  return (
    <View key={index}>
      <TouchableOpacity onPress={key => this.doSomething(key)}>
        <View>
          <Text>{key}</Text>
        </View>
      </TouchableOpacity>
    </View>
  )

Каждая клавиша отображается правильно в компоненте Text, но при нажатии функция onPress получает Объект класса, а не строка, которая правильно отображается:

 Class {
    "_dispatchInstances": null,
    "_dispatchListeners": null,
    "_targetInst": FiberNode {
      "tag": 5,
      "key": null,
      "type": "RCTView",
    },
    "bubbles": undefined,
    "cancelable": undefined,
    "currentTarget": null,
    "defaultPrevented": undefined,
    "dispatchConfig": Object {
      "dependencies": Array [],
      "registrationName": "onResponderGrant",
    },
    "eventPhase": undefined,
    "isDefaultPrevented": [Function functionThatReturnsFalse],
    "isPersistent": [Function functionThatReturnsTrue],
    "isPropagationStopped": [Function functionThatReturnsFalse],
    "isTrusted": undefined,
    "nativeEvent": Object {
      "changedTouches": Array [
        [Circular],
      ],
      "identifier": 0,
      "locationX": 4.013671875,
      "locationY": 11.8740234375,
      "pageX": 169.013671875,
      "pageY": 275.8740234375,
      "target": 207,
      "timestamp": 30722773,
      "touches": Array [
        [Circular],
      ],
    },
    "target": 207,
    "timeStamp": 1586871822926,
    "touchHistory": Object {
      "indexOfSingleActiveTouch": 0,
      "mostRecentTimeStamp": 30722855,
      "numberActiveTouches": 0,
      "touchBank": Array [
        Object {
          "currentPageX": 169.1015625,
          "currentPageY": 277.138671875,
          "currentTimeStamp": 30722855,
          "previousPageX": 169.1015625,
          "previousPageY": 277.138671875,
          "previousTimeStamp": 30722853,
          "startPageX": 169.013671875,
          "startPageY": 275.8740234375,
          "startTimeStamp": 30722773,
          "touchActive": false,
        },
      ],
    },
    "type": undefined,
  },

Почему String передается в функцию onPress как объект Class?

Answer 1

React передает Событие как первый параметр вашей функции. Когда вы пишете {key =>, вы создаете новую переменную с именем key, которая на самом деле является событием, а не ожидаемой строкой. Вы можете просто поставить пустые скобки (или назвать имя параметра, отличное от key), и оно должно работать как вы ожидаете. Например:

onPress={() => this.doSomething(key)}`