javascript - Firebase 插入发生而不是更新，没有显示错误

Question

我正在尝试使用 react native 更新 firebase 数据库中的字段，而是在单击按钮时插入新条目。

import React,{Component} from 'react';
import {  Platform, StyleSheet, StatusBar, View, Text, TextInput, Button, Alert } from 'react-native';
import {editAp} from '../pages/func';
import firebase from 'firebase';
if (!firebase.apps.length) {
 firebase.initializeApp({});
}
class Edit1 extends Component {
constructor(props){
super(props);
this.state = {
    email:this.props.navigation.state.params.email,
    password:this.props.navigation.state.params.password,
    keyis:this.props.navigation.state.params.keyis,
 };
}
submit1=()=>{
    console.log(this.props.navigation.state.params.keyis)
    firebase.database().ref('/users1').child(this.props.navigation.state.params.keyis).update(({email:this.state.email,password:this.state.password}))
    Alert.alert('Action!', 'user updated');
}
render(){
  return (
        <View style={styles.container}>
            <Text>Edit Here</Text>
            <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={email=>this.setState({email})} value={this.state.email}/>
            <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={password=>this.setState({password})} value={this.state.password}/>
            <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={keyis=>this.setState({keyis})} value={this.state.keyis}/>
       <Button title='Submit' onPress={this.submit1} />
        </View>
    );
    }
}
 const styles = StyleSheet.create({
 container: {
 flex:1,
 justifyContent: 'center',
 backgroundColor: '#fff',
 padding: 30,
 },
 });
 export default Edit1;

我不知道我在 textinput 字段和控制台上获得的更新功能电子邮件、密码、keyis 值有什么问题，submit1 函数有什么问题？数据库结构如下：

插入代码：

    import React,{Component} from 'react';
import {  Platform, StyleSheet, StatusBar, View, Text, TextInput, Alert, Button, TouchableOpacity, FlatList } from 'react-native';
import firebase from 'firebase';
if (!firebase.apps.length) {    firebase.initializeApp({}); }
class Form2 extends Component<{}> {
  constructor(props){
    super(props);
   this.state = {
     email:'',
    password:'',
      };  }
   addNew = () => {
    firebase.database().ref('/users1').push({
      email: this.state.email,
      password: this.state.password,

    });
    Alert.alert('Action!', 'user added');
    this.setState({
      email:'',
      password:'',
});  }
   render() {
  return(
<View style={styles.container}>
<Text style={styles.inpt}>Insert Ravel</Text>
<TextInput style={styles.inputBox1} underlinerColorAndroid='rgba(0,0,0,0)'
placeholder="Email"  onChangeText={e => { this.setState({  email: e,            });          }}     />
<TextInput style={styles.inputBox2} underlinerColorAndroid='rgba(0,0,0,0)'  placeholder="password" 
onChangeText={e => { this.setState({ password: e,            });       }}   />
<View style={styles.button1}>
<Button title='Insert Record' onPress={this.addNew.bind(this)}/>
</View></View>  )   } }
export default Form2;

标签： javascriptreactjsfirebasereact-nativefirebase-realtime-database

Answer 1

尝试用我的代码替换您的代码：

注册部分：

import React,{Component} from 'react';
import {  Platform, StyleSheet, StatusBar, View, Text, TextInput, Alert, Button, TouchableOpacity, FlatList } from 'react-native';
import firebase from 'firebase';
if (!firebase.apps.length) {    firebase.initializeApp({}); }
class Form2 extends Component<{}> {
  constructor(props){
    super(props);
   this.state = {
     email:'',
    password:'',
      };  }
   addNew = () => {

    //MODIFIED PATH HERE
    firebase.database().ref('/users1/'+firebase.auth().currentUser.uid).set({

      email: this.state.email,
      password: this.state.password,

    });
    Alert.alert('Action!', 'user added');
    this.setState({
      email:'',
      password:'',
});  }

//This will creating node with user UID as value

更新活动代码：

import React,{Component} from 'react';
import {  Platform, StyleSheet, StatusBar, View, Text, TextInput, Button, Alert } from 'react-native';
import {editAp} from '../pages/func';
import firebase from 'firebase';
if (!firebase.apps.length) {
 firebase.initializeApp({});
}
class Edit1 extends Component {
constructor(props){
super(props);
this.state = {
    email:this.props.navigation.state.params.email,
    password:this.props.navigation.state.params.password,
    keyis:this.props.navigation.state.params.keyis,
 };
}
submit1=()=>{
    console.log(this.props.navigation.state.params.keyis)

//Modified path here also

firebase.database().ref('/users1/').child(firebase.auth().currentUser.uid).update(({email:this.state.email,password:this.state.password}))
        Alert.alert('Action!', 'user updated');
    }
    render(){
      return (
            <View style={styles.container}>
                <Text>Edit Here</Text>
                <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={email=>this.setState({email})} value={this.state.email}/>
                <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={password=>this.setState({password})} value={this.state.password}/>
                <TextInput style={{marginTop:20, height:40, borderColor:'gray', borderWidth:1}} onChangeText={keyis=>this.setState({keyis})} value={this.state.keyis}/>
           <Button title='Submit' onPress={this.submit1} />
            </View>
        );
        }
    }
     const styles = StyleSheet.create({
     container: {
     flex:1,
     justifyContent: 'center',
     backgroundColor: '#fff',
     padding: 30,
     },
     });
     export default Edit1;

我所做的只是修改了您的数据路径。我假设您的用户已注册，因为我在您的注册码中看不到任何注册内容。

只是改变路径。其余代码相同。这将使用用户 UID 而不是数据库 ID 创建节点。让我知道它是否有效。不要忘记创建新用户。