Btukfyl

I have a simple Notes React Native app and I am able to add and get data to it, but I am not sure how to remove/update data. The main problem is in getting the part where I tell firebase which data to remove. How can I pass a firebase key to a 'delete' function that takes the key as parameter and remove it from firebase.
I'm an absolute beginner at React Native, my code is the following:

export default class App extends React.Component {

  constructor(props) {

  super(props);

  this.state = {

    all_notitas: ,

    notita_text: ''

  };

};



componentWillMount() {

  const notitasRef = firebase.database().ref('notitas');

  this.listenForNotitas(notitasRef);

};



listenForNotitas = (notitasRef) => {

  notitasRef.on('value', (dataSnapshot) => {

    var aux = ;

    dataSnapshot.forEach((child) => {

      aux.push({

        date: child.val().date,

        notita: child.val().notita

      });

    });

    this.setState({all_notitas: aux});

  });

};  // listenForNotitas



render() {

  let show_notitas = this.state.all_notitas.map((val, key) => {

    return (

      <Notita

        key={key}

        keyval={key}

        val={val}

        eventDeleteNotita={()=>this.deleteNotita(key)}> // I THINK THIS IS THE PROBLEM

      </Notita>

    );

  });



  return (

    <View style={styles.container}>



      <View style={styles.header}>

        <Text style={styles.headerText}>NOTITAS</Text>

      </View>



      <ScrollView style={styles.scrollContainer}>

        {show_notitas}

      </ScrollView>



      <View style={styles.footer}>

        <TouchableOpacity

          style={styles.addButton}

          onPress={this.addNotita.bind(this)}>

          <Text style={styles.addButtonText}>+</Text>

        </TouchableOpacity>



        <TextInput

          style={styles.textInput}

          placeholder='>>> Escribir notita'

          placeholderTextColor='white'

          underlineColorAndroid='transparent'

          onChangeText={(notita_text) => (this.setState({notita_text}))}

          value={this.state.notita_text}>



        </TextInput>

      </View>



    </View>

  );

}



addNotita() {

  if (this.state.notita_text) {

    var d = new Date();

    dataForPush = {

      'date': d.getDate() + '-' +  d.getMonth() + '-' + d.getFullYear(),

      'notita': this.state.notita_text

    };

    firebase.database().ref('notitas').push(dataForPush);

    this.state.all_notitas.push(dataForPush);

    this.setState(

      {

        all_notitas: this.state.all_notitas,

        notita_text: '',  // Limpiar input

      }

    )

  }  // end if

}  // addNotita

When I do 'console.log(key)', it returns an int like 0, 1, 2, etc. It should return a firebase key like '-LRtghw8CjMsftSAXMUg' for example. I don't know what I am doing wrong and how to fix it.

deleteNotita(key) {

  firebase.database().ref('notitas').child('' + key).remove()



  /*

  let updates = {};

  console.log(key);

  console.log(updates['/notitas/' + key]);

  updates['/notitas/' + key] = null;

  firebase.database().ref().update(updates); */



  this.state.all_notitas.splice(key, 1);

  this.setState({all_notitas: this.state.all_notitas});

} // deleteNotita



}

You're dropping the key from Firebase when you're adding the notes to aux. The solution is to also keep the key from Firebase in there:

notitasRef.on('value', (dataSnapshot) => {

  var aux = ;

  dataSnapshot.forEach((child) => {

    aux.push({

      date: child.val().date,

      notita: child.val().notita,

      id: child.key

    });

  });

  this.setState({all_notitas: aux});

}

And then pass that value to deleteNotita with:

this.deleteNotita(val.id)