React-Native TouchableHighlit OnPress функция

Question

У меня есть складную ListView, каждый элемент является touchablehighlight всякий раз, когда пользователь нажимает на них, мне нужно перенаправить пользователя на другую страницу, с некоторым идентификатором (аргументы, идентификатор touchablehighlight в)

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

Любые решения? в чем моя ошибка?

var Accordion = require('react-native-accordion'); 
 

 
class Courses extends Component { 
 

 
    constructor(props) { 
 
     super(props); 
 
     this.state = { 
 
      dataSource: new ListView.DataSource({ 
 
      rowHasChanged: (row1, row2) => row1 !== row2, 
 
      }), 
 
      loaded: false, 
 
     }; 
 
    } 
 

 
    fetchData() { 
 
// fetching data 
 
    } 
 

 
    componentDidMount() { 
 
    this.fetchData(); 
 
    } 
 

 
    render(){ 
 
    if (!this.state.loaded) { 
 
     return this.renderLoadingView(); 
 
    } 
 

 
    return (
 
     <View style={{ 
 
     flex: 1 
 
     }}> 
 
     <ListView 
 
     dataSource={this.state.dataSource} 
 
     renderRow={this.renderRow} 
 
     style={styles.listView} 
 
     /> 
 
     </View> 
 
    ); 
 
    } 
 

 
    renderRow(data) { 
 

 
    var header = (
 
     <View> 
 
      <View style={styles.rowContainer}> 
 
      <View style={styles.textContainer}> 
 
       <Text style={styles.title}>{data.nid}</Text> 
 
       <Text style={styles.description} numberOfLines={0}>{data.title}</Text> 
 
      </View> 
 
      </View> 
 
      <View style={styles.separator}></View> 
 
    </View> 
 
    ); 
 
/////////// 
 
    var content = []; 
 
    for(var x=0; x < Object.keys(data.course).length; x++){ 
 
     var title = data.course[x].title; 
 
     var course_id = data.course[x].course_id; 
 
     content.push(
 
     <TouchableHighlight 
 
     underlayColor='#e3e0d7' 
 
     key={x} 
 
     onPress={() => { 
 
      console.log(title); ///<<<<<< here is the problem >>>>>> 
 
     }} 
 
     style={styles.child} 
 
     > 
 
     <Text style={styles.child}> 
 
     {data.course[x].title} 
 
     </Text> 
 
     </TouchableHighlight> 
 
    ); 
 
    } 
 
    var clist = (
 
     <View style={styles.rowContainer}> 
 
     {content} 
 
     </View> 
 
    ); 
 
//////////// 
 
    return (
 
     <Accordion 
 
     header={header} 
 
     content={clist} 
 
     easing="easeOutCubic" 
 
     /> 
 
    ); 
 
    } 
 

 
    renderLoadingView() { 
 
    return (
 
     <View style={styles.loading}> 
 
     <Text style={styles.loading}> 
 
      Loading Courses, please wait... 
 
     </Text> 
 
     </View> 
 
    ); 
 
    } 
 
} 
 

 
module.exports = Courses;

---

Я попытался определить функцию, как раз перед Render() функцию, как это:

rowPressed(){ 
    console.log('row pressed'); 
    } 

    render(){ 
    if (!this.state.loaded) { 
     return this.renderLoadingView(); 
    } 

И я назвал это так:

var content = []; 
    for(var x=0; x < Object.keys(data.course).length; x++){ 
     var title = data.course[x].title; 
     var course_id = data.course[x].course_id; 
     content.push(
     <TouchableHighlight 
     underlayColor='#e3e0d7' 
     key={x} 
     onPress={() => this.rowPressed() } 
     style={styles.child} 
     > 
     <Text style={styles.child}> 
     {data.course[x].title} 
     </Text> 
     </TouchableHighlight> 
    ); 
    } 
    var clist = (
     <View style={styles.rowContainer}> 
     {content} 
     </View> 
    ); 

, но он дает ошибку, что: Не удается прочитать свойство «rowPressed» нулевых

Я попытался добавив в конструктор, но оно не даже помощь: this.rowPressed = this.rowPressed.bind (это)

также добавление связываются с onpress не помогло:

onPress={() => this.rowPressed().bind(this) } 

Answer 1

Попробуйте сделать это:

for(let x=0; x < Object.keys(data.course).length; x++){} 

ли это в й e renderRow первый из двух способов, которыми вы его пишете выше.

Этот способ x должен быть правильно скопирован.