Question

每当我的互联网连接不好时，我都会收到此警告（即使这是正确的原因，我也不确定）。我在显示来自反应本机应用程序（iOS / android）中的Firebase数据库的页面中获取此信息。 PS：我没考虑进行离线模式（这不是必需的）。我正在与您分享我在其中一个页面中使用的代码（在所有页面中都非常相似）

代码

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

            this.itemsRef = this.getRef().child('path');

        }

        getRef() {
            return firebaseApp.database().ref();
        }
        componentDidMount() {
            this.listenForItems(this.itemsRef);
        }
        listenForItems(itemsRef) {

            itemsRef.on('value', (snap) => {
                if (snap.val()) {
                    var items = [];
                    snap.forEach((child) => {
                        items.push({
                            text : child.val().text,
                            title: child.val().title,
                            key: child.key
                        });
                    });

 this.setState({dataSource: this.state.dataSource.cloneWithRows(items)});
                }

            });

        }

        render() {
            return (
                <View>
                    <ListView
                        automaticallyAdjustContentInsets={true}
                        dataSource={this.state.dataSource}
                        renderRow={this._renderItem.bind(this)}/>
                </View>

            );
        }

        _renderItem(item) {
            return (
                <View>
                    <Text>{item.title}</Text>
                    <Text>{item.text}</Text>
                </View>
            );
        }
    }

这是我一直收到的警告：

它确实提到了该组件的名称，但我仍然不知道这可能是什么原因

更新：我尝试了这个提议的解决方案：

componentWillUnmount() {
        this.itemRef.off();
    }

实际上我有一个从一个页面更改为另一个页面的后退按钮（每个页面都有自己的路径和从Firebase中提取的数据，但代码类似），我收到此错误：this.itemRef在每个页面中有所不同。但是我收到了这个错误：任何想法或建议..谢谢

Answer 1

当您使用on()订阅引用时，您将在修改数据库路径时收到通知，这也会在卸载组件时发生。为了防止出现此警告，您必须在componentWillUnmount

上call off()使用相同的数据库引用

componentWillUnmount() {
  this.itemsRef.off();
}

setState：只能更新已挂载或挂载的组件反应native / undefined不是对象

1 个答案: