按键删除项目,Firebase React Native

时间:2018-11-22 18:55:57

标签: javascript firebase react-native firebase-realtime-database

我有一个简单的Notes React Native应用程序,可以向其中添加和获取数据,但是我不确定如何删除/更新数据。主要问题在于获取我告诉Firebase要删除哪些数据的部分。如何将Firebase密钥传递给以该密钥为参数的“删除”函数,并将其从Firebase中删除。 我是React Native的绝对初学者,我的代码如下:

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

当我执行“ console.log(key)”时,它返回一个整数,例如0、1、2等。它应该返回一个Firebase密钥,例如,“-LRtghw8CjMsftSAXMUg”。我不知道自己在做什么错以及如何解决。

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

}

1 个答案:

答案 0 :(得分:1)

将注释添加到aux时,将从Firebase中删除密钥。解决方案是还要将Firebase的密钥保存在其中:

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

然后使用以下命令将该值传递到deleteNotita

this.deleteNotita(val.id)