Я не могу вызвать функцию через onPress () TouchableOpacity - PullRequest
0 голосов
/ 20 февраля 2020

Я несколько растерялся из-за того, почему я продолжаю получать TypeError: Chat.onCameraClick is not a function. (In 'Chat.onCameraClick()', 'Chat.onCameraClick' is undefined).

У меня есть следующее:

export default class Chat extends React.Component {
  static navigationOptions = ({ navigation }) => ({
    title: 'Chat',
    headerTintColor: colors.HEADERTINT,
    headerStyle: {
      backgroundColor: colors.HEADER,
    },
    headerLeft: () => (
      <TouchableOpacity onPress={() => navigation.dispatch(DrawerActions.openDrawer())}>
        <Icon
          name="menu"
          size={24}
          style={{ color: colors.BLACK, marginLeft: 10 }}
        />
      </TouchableOpacity>
    ),
    headerRight: () => (
      <TouchableOpacity onPress={() => this.onCameraClick()}>
        <Icon
          name="camera"
          type='font-awesome'
          size={24}
          style={{ color: colors.BLACK, marginRight: 10 }}
        />
      </TouchableOpacity>
    ),
  });

Далее, у меня просто метод камеры:

  onCameraClick = () => {
    console.log("Pic!");
  }

Я смотрел на сообщения типа RN TouchableOpacity onPress я не вызываю функцию и документацию по touchableopacity здесь https://facebook.github.io/react-native/docs/touchableopacity но я не уверен, почему это будет "неопределенным". Я также пытался просто вызвать onPress={this.onCameraClick}, но в основном происходит то же самое .

Что мне здесь не хватает?

Ответы [ 2 ]

0 голосов
/ 22 февраля 2020

Причина, по которой это не сработало, заключалась в том, что я вызываю функцию из моего класса из навигации, и это работает отдельно. Чтобы заставить его работать, мне пришлось установить параметр и затем вызвать его выше.

Добавление к моему componentDidMount():

this.props.navigation.setParams({ onCameraClick: this.onCameraClick });

И затем изменив навигацию на:

<TouchableOpacity onPress={navigation.getParam('onCameraClick')}>
0 голосов
/ 22 февраля 2020

я вижу твой код, я немного изменил его. и теперь он работает.

headerRight: () => (
  <TouchableOpacity onPress={this.onCameraClick}> // <<--- here
    <Icon
  name="camera"
  type='font-awesome'
  size={24}
  style={{ color: colors.BLACK, marginRight: 10 }}
/>
  </TouchableOpacity>
),

, где вы вызвали свою функцию, просто удалите круглые скобки и просто сделайте одну функцию стрелки.

...