Remove Key in Firebase with React Native

0

I have a mobile practice application which I am developing with React Native that allows you to add notes and upload them to Firebase. I can currently bring and add notes from Firebase to my app. I am very beginner and I am having problems to eliminate notes. I need to know what I'm doing wrong when trying to delete a note and how I can solve it. I tried many ways and there is no case. I enclose the code:

import React from 'react';

import {
StyleSheet,
View,
Text,
TextInput,
ScrollView,
TouchableOpacity
} from 'react-native';

import Notita from './componentes/Notita';

import firebase from 'firebase';

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);
};

render() {

  // Recorro el array de notitas y retorno una Notita
  let show_notitas = this.state.all_notitas.map((val, key) => {
    return (
      <Notita
        key={key}
        keyval={key}
        val={val}
        eventDeleteNotita={()=>this.deleteNotita(key)}>
      </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>
  );
}

The problem is here, if I print the value of the key parameter it returns a number like 0, 1, 2, etc., and what actually should happen is the key of the note, which would have a format like -LRtghw8CjMsftSAXMUg or something like that.

  deleteNotita(key) {
    /*
    Borrar una notita. Requiere key/id de la notita.
    Se hizo esta función para borrar
    una notita del array de notitas en el estado.
    Se le pasa una key o id y la cantidad de elementos,
    en este caso, uno. Luego se refresca el estado.
    */
    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});  // Refrescar estado
  } // deleteNotita

I do not know how to go through the real key and not a number how is it happening now? I have the feeling that the error is here:

// Recorro el array de notitas y retorno una Notita
  let show_notitas = this.state.all_notitas.map((val, key) => {
    return (
      <Notita
        key={key}
        keyval={key}
        val={val}
        eventDeleteNotita={()=>this.deleteNotita(key)}>  // JUSTO AQUI
      </Notita>
    );
  });
    
asked by Javier Pugliese 22.11.2018 в 06:06
source

0 answers