代码之家  ›  专栏  ›  技术社区  ›  Saeid

在react native中不调用平面列表中的函数

  •  0
  • Saeid  · 技术社区  · 6 年前

    我正在使用react native开发一个应用程序。我想在我的平面列表中为特定记录传递一个参数给一个函数。但是,简单列表忽略了这一行代码: onPress={ () => {console.log("TEST1"); this.onPressTopUp()} } />

    这是我的代码:

    <FlatList
    ItemSeparatorComponent={ () => <View style={ styles.rowSep } /> }
    horizontal={false}
    data={this.state.result}
    
    renderItem={
         ({item}) => (
              <View style={styles.containerrow}>
              <View style={styles.viewPark}>
    
              <Text style={styles.itemBold}> {I18n.t('Data_e_ora_inizio')}:
              <Text style={styles.itemNormal}>{item.start}</Text></Text>             
              <Text style={styles.itemBold}> {I18n.t('Data_e_ora_termine')}: 
              <Text style={styles.itemNormal}>{item.end}</Text></Text>
              <Text style={styles.itemBold}> {I18n.t('Energia')}: <Text style={styles.itemNormal}>{item.energy_delivered}</Text></Text>
              <Text style={styles.itemBold}> {I18n.t('Colonna')}: <Text style={styles.itemNormal}>{item.column_id}</Text></Text>
              <Text style={styles.itemBold}> {I18n.t('Costo_della_ricarica')}: 
              <Text style={styles.itemNormal}>€ {item.amount}</Text></Text>
              <Text style={styles.itemBold}> {I18n.t('Aggiornamento_del')}:     
              <Text style={styles.itemNormal}>{item.last_update}</Text></Text>
                                             </View>
    
            <View style={styles.rowCenter}>
              <Button label={I18n.t('Via_questa_ricarica')} color={defStyleValues.RechargeElectricCar} onPress={ () => {console.log("TEST1"); this.onPressTopUp()} } />
                   </View>
                </View>
              )
            }
        keyExtractor={item => item.id}
     />
    

    还有我的功能:

    onPressTopUp(columnID){
            console.log("TEST2, ", columnID);
    }
    

    换句话说,我的问题是需要将每个特定行的columnID传递给 onPressTopUp(columnID) 平面列表中的函数。我检查了控制台日志,即使它没有同时显示TEST1和TEST2。你能帮我做那件事吗?

    3 回复  |  直到 6 年前
        1
  •  2
  •   Sachin Rajput KgaboL    6 年前

    只需使用箭头功能,它将负责绑定。

    您的功能是:-

    onPressTopUp(columnID){
            console.log("TEST2, ", columnID);
    }
    

    替换为箭头功能:- 它会对你有用的。

    onPressTopUp = (columnID) => {
         console.log("Test, ", columnID);
    }
    

    并使用按钮内的标题更改标签属性

    您可以使用如下按钮:-

    import { Button } from 'react-native';
    ...
    
    <Button
      onPress={onPressLearnMore}
      title="Learn More"
      color="#841584"
      accessibilityLabel="Learn more about this purple button"
    />
    
        2
  •  1
  •   gaback    6 年前

    我想问题是你没有 bind 这个 onPressToUp 函数,请尝试以下操作:

    onPressTopUp = (columnID) => {
         console.log("Test, ", columnID);
    

    }

        3
  •  0
  •   erkan    6 年前

    按钮组件是否从React Native导入?因为react native Button组件没有label属性。 您是否尝试过这样使用列id调用函数。按向上(15)。 希望这有帮助。