Javascript 反应本机错误：只能更新已安装或正在安装的组件

我有一个RN应用程序，当一个组件挂载时，我从Firebase读取数据（一个“收藏夹”屏幕），并将其设置为Favorites组件的状态，然后进行渲染

但是当我在另一个屏幕上向firebase中的收藏夹数据库添加项目时，我会收到一条黄色警告：

警告：只能更新已安装或正在安装的组件。这通常意味着您在未安装的组件上调用setState、replaceState或forceUpdate

当我添加一个新项目，然后更新

firebase.database（）.ref（'userfavs'）.child（DeviceID）

中的数据时，会弹出这个窗口。要明确的是，功能似乎没有中断，当我从状态中注销

datalist

数组时，新的“favorited”项将按预期添加到该数组中

class Favorites extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      datalist: []
    };
    this.favsRef = firebase.database().ref('userfavs').child(DeviceID);
  }
  listenForItems(favsRef) {
    favsRef.on('value', (snap) => {
      var items = [];
      snap.forEach((child) => {
         items.push(child.val()
          );
        });
      });
      this.setState({
        datalist: items
         });
     });
  }

  componentWillMount() {
    this.listenForItems(this.favsRef);
  }

  render() {
    console.log('state datalist:', this.state.datalist);
    ... }}

我真的不理解这个错误，因为我已经将

listenForItems

调用放在

componentWillMount

下，所以每当我导航到“收藏夹”屏幕并加载此组件时，它都会下拉Firebase中的最新数据

---

谢谢

您可能正在添加一个侦听器，以便在卸载收藏夹组件后将其保存在内存中

根据文档，有一种分离侦听器的

.off

方法：

解决方案如下：

class Favorites extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      datalist: []
    }
    this.favsRef = firebase.database().ref('userfavs').child(DeviceID);
    this.listen = snap => {
      const dataItems = snap.map(child => child.val())
      this.setState({dataItems})        
    }
  }

  componentDidMount() { this.favsRef.on('value', this.listen) }
  componentWillUnmount() { this.favsRef.off('value', this.listen) }

---

你试过componentdidmount吗？@eosterberg是的！componentdidmount和componentwillmount都存在错误。然后我猜您的收藏夹组件已卸载，我建议在设置状态之前检查您的组件是否已装载，但在我向firebase数据库添加项目时，我没有设置

收藏夹
组件的状态。。。
.setState
仅在我调用
listenformes
时才会调用，因为当我重新打开收藏夹屏幕时，
componentWillMount
会被触发，否？是的，但我想收藏夹组件会保留在内存中，即使它已卸载hey@eosterberg--在代码行中复制，我运行它时出错，
snap.map不是函数。（在'snap.map（function（child）{return child.val（）；}'）中，'snap.map'不是一个函数
。好的，我只是伪编码，然后您必须使用forEach循环