Как выполнить клик по элементу ListView в React Native?

Question

[Konstantin Chuykov]

Здравствуйте! Пишу первое приложение на ReactNative, получил данные с сервера, вывел их с помощью ListView, но при клике на элемент, получаю ошибку:



Вот код:

import React, { Component } from 'react';
import * as cnf from './config.js';
import {
  AppRegistry,
  Text,
  Image,
  ListView,
  TouchableHighlight,
  View
} from 'react-native';

export default class Users extends Component {
    constructor(props) {
    super(props);
    
    this._onPress = this._onPress.bind(this);
    
    this.state = {
      users : new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
      }),
      loaded: false
    }
    
  }

componentDidMount() {
    fetch(cnf.REQUEST_URL + 'publications/users')
      .then((response) => response.json())
      .then((responseData) => {
        this.setState({
          users: this.state.users.cloneWithRows(responseData.users),
          loaded: true
        });
      })
      .catch((error) => {
        console.warn(error);
      })
      .done();
  }

render() {
    if (!this.state.loaded) {
      return this.renderLoadingView();
    }
    return(
      <View>
        <View style={styles.blockTitle}>
          <Text style={styles.actionTitle}>Выберите пользователя:</Text>
        </View>
        <ListView
          style={styles.listView}
          dataSource={this.state.users}
          renderRow={this.rowUser}
        />
      </View>
    );
  }
  
  _onPress() {
    console.log('fd');
  }
  
  rowUser(user) {
    if(user.roles[0] == 'user') {
      return (
        <TouchableHighlight onPress={() => this._onPress()}>
          <View style={styles.container}>
            <Image
              source={{uri: user.profile.avatar}}
              style={styles.avatar}
            />
            <View style={styles.rightContainer}>
              <Text style={styles.name}>{user.profile.fio}</Text>
            </View>
        </View>
      </TouchableHighlight>
      )
    } else {
      return null;
    }
      
  }

}

Помогите пожалуйста понять почему не происходит вызова функции.

Answer 1

[Konstantin Chuykov]

Оказывается решалось все очень просто.

Убираем это:
this._onPress = this._onPress.bind(this);

И меняем немного код здесь:

<ListView
          style={styles.listView}
          dataSource={this.state.users}
          renderRow={this.rowUser.bind(this)}
        />

И все прекрасно отрабатывается.