Javascript 删除React Firebase应用程序中的数据

我有以下代码用于将用户数据从Firebase导入我的React应用程序：

import React from 'react';
import AuthUserContext from './AuthUserContext';
import withAuthorization from './withAuthorization';
import * as firebase from 'firebase';
import { config, database, db, auth, itembase, } from 
'../firebase/firebase';

class Collection extends React.Component {
constructor (props) {
  super(props)
  this.state = {
    collection: []
  };

}

//Data from Firebase Database
componentDidMount() {
  var userUid = firebase.auth().currentUser.uid;
  const collection = firebase.database().ref(`/users/${userUid}/collection/`)

  collection.on('value', snapshot => {
    this.setState({
      collection: snapshot.val(),
    })
  })
}

//Remove from user collection
removeToCollection(key, e) {
  const userUid = firebase.auth().currentUser.uid;
  const item = {
    nom: this.state.collection[key].nom,
    parution: this.state.collection[key].parution
  };
  firebase.database().ref(`users/${userUid}/collection/`).remove(item)

 }

render(){
  const collection= Object.keys(this.state.collection).map(key => {
    return (
      <div key={key}>
        <h3>{this.state.collection[key].nom}</h3>
        <p>{this.state.collection[key].parution}</p>
        <button className="btn btn-danger" onClick={this.removeToCollection.bind(this, key)}>Remove</button> </div>
        )
      });
    return (
      <div>
        {collection}
      </div>
    )
 }

}

const authCondition = (authUser) => !!authUser;

export default withAuthorization(authCondition)(Collection);

从“React”导入React；
从“/AuthUserContext”导入AuthUserContext；
使用授权从“/使用授权”导入；
从“firebase”导入*作为firebase；
从导入{config，database，db，auth，itembase，}
“../firebase/firebase”；
类集合扩展了React.Component{
建造师（道具）{
超级（道具）
此.state={
收藏：[]
};
}
//来自Firebase数据库的数据
componentDidMount（）{
var userUid=firebase.auth（）.currentUser.uid；
const collection=firebase.database（）.ref（`/users/${userUid}/collection/`）
collection.on（'value'，snapshot=>{
这是我的国家({
集合：snapshot.val（），
})
})
}
//从用户集合中删除
移除集合（键，e）{
const userUid=firebase.auth（）.currentUser.uid；
常数项={
nom:this.state.collection[key].nom，
参数：this.state.collection[key]。参数
};
firebase.database（）.ref（`users/${userUid}/collection/`）。删除（项）
}
render（）{
const collection=Object.keys（this.state.collection）.map（key=>{
返回(
{this.state.collection[key].nom}
{this.state.collection[key].parution}

去除
)
});
返回(
{collection}
)
}
}
const authCondition=（authUser）=>！！authUser；
使用授权导出默认值（authCondition）（集合）；

正如您所看到的，当用户单击删除按钮时，我有一个删除数据的功能。 我的问题是，当我单击按钮时，会出现一条错误消息

下面是我的数据库的外观：

提前非常感谢您的帮助

错误来自：

firebase.database().ref(`users/${userUid}/collection/`).remove(item)

看起来您正试图传入要删除的项目。

remove

方法不是这样工作的

remove

方法删除调用位置的所有数据。如果将一个参数传递给

remove

，Firebase希望该参数是一个回调函数，在删除完成（或失败）后调用该函数

因此，您需要创建要删除的项目的完整路径：

let key = "-LlouZxkW1N3Llt6h5nm"
firebase.database().ref(`users/${userUid}/collection/${key}`).remove()

如果您不知道要删除的项的键，则首先需要执行查询以查找该项并确定其键。

错误来自：

firebase.database().ref(`users/${userUid}/collection/`).remove(item)

看起来您正试图传入要删除的项目。

remove

方法不是这样工作的

remove

方法删除调用位置的所有数据。如果将一个参数传递给

remove

，Firebase希望该参数是一个回调函数，在删除完成（或失败）后调用该函数

因此，您需要创建要删除的项目的完整路径：

let key = "-LlouZxkW1N3Llt6h5nm"
firebase.database().ref(`users/${userUid}/collection/${key}`).remove()

---

如果您不知道要删除的项的键，则首先需要执行查询以查找该项并确定其键。

firebase.database（）.ref（

/users/${userUid}/collection/

）.set（null）；你好，Shubham Agarwal Bhewanewala，谢谢你的帮助。我按照你说的做了，但是现在函数删除了“collection”中的所有数据，我只想删除item collection键对应的数据。我有一条错误消息：“TypeError:无法将undefined或null转换为object”，我给了你一个删除节点的示例。你应该尝试使用一个建议来寻找答案，如果它在ref中显示了一些结果（把你的url放在正确的位置上）。。假设在第一个对象的集合中，您要删除第一个元素，然后将/users/${userUid}/collection/${objectKey}/传递给您的ref并将其设置为null，这将完成您的jobfirebase.database（）.ref（

/users/${userUid}/collection/

）.set（null）；你好，Shubham Agarwal Bhewanewala，谢谢你的帮助。我按照你说的做了，但是现在函数删除了“collection”中的所有数据，我只想删除item collection键对应的数据。我有一条错误消息：“TypeError:无法将undefined或null转换为object”，我给了你一个删除节点的示例。你应该尝试使用一个建议来寻找答案，如果它在ref中显示了一些结果（把你的url放在正确的位置上）。。假设在第一个对象的集合中，您要删除第一个元素，然后将/users/${userUid}/collection/${objectKey}/传递给您的ref并将其设置为null，这将完成您的工作Hello Frank van Puffelen，感谢您的帮助。我更了解我的错误，但经过多次测试，我不知道如何知道该项目的关键。我完全是初学者，所以你能告诉我更多关于这个主题的信息吗？你需要知道一些识别你试图删除的密钥的信息。例如，如果您知道用户的电子邮件地址，并且希望删除具有该电子邮件地址的所有节点，则可以查询该电子邮件地址（类似于

firebase.database（）.ref（“用户”）.orderByChild（“email”）.equalTo（“theemailaddress”）

），并删除所有生成的节点。您好，Frank van Puffelen，感谢您的帮助。我更了解我的错误，但经过多次测试，我不知道如何知道该项目的关键。我完全是初学者，所以你能告诉我更多关于这个主题的信息吗？你需要知道一些识别你试图删除的密钥的信息。例如，如果您知道用户的电子邮件地址，并且希望删除具有该电子邮件地址的所有节点，则可以查询该电子邮件地址（类似于

firebase.database（）.ref（“用户”）.orderByChild（“电子邮件”）.equalTo（“电子邮件地址”）

），并删除所有生成的节点。