无法通过反应在firebase中删除项目答案

【问题标题】：Cant get item to delete in firebase with react无法通过反应在firebase中删除项目
【发布时间】：2020-02-20 03:37:21
【问题描述】：

我的删除按钮和创建按钮不起作用，我不断收到此错误：

未捕获的错误：reference.child 失败：第一个参数是无效路径

 import React, { Component } from 'react';
    import { View, Text, StyleSheet, Button, TextInput, TouchableOpacity, selectedId } from 'react-native';
    import firebase from './firebase';
    export default class App extends Component {
    carDatabase = firebase.database().ref('car');
     state = { cars: {}, selectedId: '' }
     // Read
     componentDidMount() {
       this.carDatabase.on('value', cars => {
         const carsJSON = cars.val();
         this.setState({ cars: carsJSON === null ? {} : carsJSON });
       })
       // this.carDatabase.push({color: 'yellow'})
     }
     // Create
     create() {
       this.carDatabase.push({color: 'yellow'})  
       this.setState({selectedId: ''})
     }
     // Update
     update() {
      this.carDatabase.child(this.state.selectedId).set({color: 'blue'}) 
      this.setState({selectedId: ''})
    }
     // Delete
     deleteCar() {
        if(this.state.selectedId === '') {
          return;

        }
       // firebase.database().ref('car/').remove
       this.carDatabase.child(this.state.selectedId).set(null)
      this.setState({selectedId: ''})
    }
        render() {
            return (
                <View style={styles.container}>
                 <TextInput value={this.state.selectedId} style={styles.textInput}></TextInput>
                   <Button title="create" onPress={() => this.create()}></Button> 
                   <Button title="update" onPress={() => this.update()}></Button> 
                   <Button title="delete" onPress={() => this.deleteCar()}></Button> 
                   {
       Object.keys(this.state.cars).map( ( index) =>
       <TouchableOpacity key={index} onPress={() => this.setState({ selectedId})}>
         <Text>{JSON.stringify(this.state.cars[index])}</Text>
       </TouchableOpacity>
     )
    }

           {/* <Text>{JSON.stringify(this.state.cars, null, 2)}</Text> */}
         </View>
            );
        }
    }
    const styles = StyleSheet.create({
     textInput: {
       backgroundColor: 'green',
       height: 30,
       width: '100%'
     },
        container: {
            flex: 1,
            backgroundColor: '#fff',
            alignItems: 'center',
            justifyContent: 'center'
     }
    });

【问题讨论】：

我在下面添加了一个快速答案。但是在这种情况下，同时拥有错误的堆栈跟踪总是非常有用的，包括指出堆栈跟踪指向的行。如果我的回答不能帮助您解决问题，请将这些添加到您的问题中（并且请始终添加它们）。

标签： javascript firebase react-native firebase-realtime-database expo

【解决方案1】：

看起来this.state.selectedId 包含在您的数据库中不是有效路径的内容。您可以通过在使用它之前记录该值来找出它的实际含义。例如：

deleteCar() {
  console.log(this.state.selectedId)
  this.carDatabase.child(this.state.selectedId).set(null)
  this.setState({selectedId: ''})
}

this.state.selectedId 很可能为 null 或空。现在你只检查一个空字符串，所以如果你这样做，你可能会得到更好的结果：

deleteCar() {
  if (this.state.selectedId && this.state.selectedId.length) {
    this.carDatabase.child(this.state.selectedId).set(null)
    this.setState({selectedId: ''})
  }
}

【讨论】：

这是我的火力基地 danni2-d27c3 汽车 -Lrq2jMUQd2unU9EuytE -LrtAX54kd97kBmOLtA4
“不工作”不是很可操作。如果在我的第一个代码 sn-p 中添加 console.log，它会输出什么？另请参阅我对您的问题留下的评论，因为没有更完整的信息很难提供帮助。我还强烈建议您查看how to create a minimal, complete, verifiable example，因为它包含许多提示如何让我们更有可能为您提供帮助。

【解决方案2】：

Object.keys(this.state.cars).map((carId, index) => this.setState({ selectedId: carId})}> {${carId}: ${JSON.stringify(this.state.cars[index])}}

【讨论】：