Question

因此，我最近开始在正在使用的应用程序中使FlatList成为经常性的事情。我现在正在处理一个显示请求列表的屏幕，一旦接受请求，该屏幕就会更新，方法是按一个按钮。我正在使用一种名为getNewRequests的方法来更新请求，但是扁平电话似乎无法调用它，因为它仅返回错误TypeError: _this3 is undefined。

我确实需要该方法起作用，因为我需要更新该屏幕的状态，并且尝试在其中键入整个方法只会返回相同的错误。在这种情况下，this始终返回undefined。

render(){
    return(
      <View style={GenericStyles.styles.genericContainer}>
        <Text> REQUEST SCREEN </Text>

        <FlatList
          data={this.state.requestList}
          renderItem={this.renderItem}
          keyExtractor={item => item.id}
          />

        <Button title="Voltar" color="cyan" onPress={() => this.props.navigation.goBack()}/>
      </View>
    );
  }

renderItem({item}){
    return(
      <Card
        containerStyle={{flex: 1, width: 200}}
        title={item.Username}>
          <Button color="blue" title="Accept" onPress={() => RequestService.allowRequest(item.id, (response) => {
            let rsp = JSON.parse(response);

            if(rsp.success){
              this.getNewRequests();
            }

          })}/>
      </Card>
    );
  }

Answer 1

您需要将函数绑定到构造函数中（或所需的任何位置）：

constructor(props){
    super(props)
    this.renderItem.bind(this)
}

或使用箭头功能：

renderItem = ({item}) => {
    //your function
}

执行此操作将使函数可以访问当前组件的this。

FlatList的renderItem无法识别“ this”关键字

1 个答案: