簡體   English   中英

問題重新呈現平面清單

[英]Problems re-rendering Flatlist

刪除給定用戶時,我正在努力更新列表。 大多數問題來自以下事實:由於將函數作為setParams放置在componentDidMount ,因此我失去了state

componentDidMount() {
    ...
    this.props.navigation.setParams({ removeUser: this._deleteUser});
    ...
}

這是_deleteUsers的功能,該功能可以刪除但不會更新:

_deleteUser(){
    var user = firebase.auth().currentUser;
    var position;
    _.map(this.selectedMembers, item => {
        var ref = firebase.database().ref('path')
        ref.orderByChild('key').equalTo(item.key).on("value", function(snapshot){
            snapshot.forEach(function(child) {
                position = child.key
            });
        });
        delete this.students.members[position]
    });

    firebase.database().ref().child('path').remove(); 

    Toast.show({
        text: "Members deleted successfully!",
        type: "success",
        fontStyle: "italic", 
    })        
}

所有這些都應在以下Flatlist呈現

    render() {
    ...
                <FlatList 
                        style={{
                            flex: 1,
                            width: "100%",
                        }}
                        refreshControl={
                            <RefreshControl
                                refreshing={this.state.refreshing}
                                onRefresh={this.refreshList}
                            />}
                        data={this.state.dataSource}
                        ItemSeparatorComponent={this.FlatListItemSeparator}
                        renderItem = {this._renderItem}
                        listKey={item => item.uid}
                        extraData={this.state}
                 />
}

並且應用程序的狀態為:

constructor(props) {
   super(props)
   this.state = {
            dataSource : [],
            text : '',
            itemNumber : 0,
            selectedItems: [],           
            groupName: '',
            selectedMembers: [],
        }
    }  
    state = {
        refreshing: false,
    }
    refreshList = () => {
        this.state.refreshing = true;
        this.props.navigation.state.params.store = new StudentsStore();
        this.state.refreshing = false;
    }

我應該如何處理? 我還有許多其他操作,但是唯一不起作用的操作是此操作,因為我在componentDidMount處理它的方式至少是這樣,我認為這是我不知道如何解決的問題。

謝謝,

傳遞回調時,您將丟失上下文。 用箭頭函數包裝回調,您將保留原始上下文。

更改:

componentDidMount() {
    ...
    this.props.navigation.setParams({ removeUser: this._deleteUser});
    ...
}

為了這:

componentDidMount() {
    ...
    this.props.navigation.setParams({ removeUser: () => this._deleteUser()});
    ...
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM