我希望能够在我的 firebase 数据库中获取自动生成的 id 子值，并在 function 中使用它们

Question

为清楚起见，当我指的是 Firebase 中的自动生成 id 时，这就是我的意思：

**-M3pezrJXXdnPVq53M8A**
description: ''

heading: ''

location: ''  

我正在使用 React Native 和 Firebase 数据库。 目的是更新所选帖子的字段。 我已经通过导航传递了帖子字段的值，并想在我的“更新帖子”屏幕中调用 Firebase 更新 function。

这是编辑画面。 参数成功传递。

import React from 'react';
import {
  StyleSheet,
  Button,
  TextInput,
  View,
  Text,
  TouchableOpacity,
} from 'react-native';
import {Formik} from 'formik';
import {styles} from './PostList';
import Firebase from 'firebase';
import 'firebase/database';

export default function EditForm({route}) {
  const post = route.params;
  const postKey = post.post.key;
  console.log(postKey);

  function updatePost(values) {
    const ref = Firebase.database()
      .ref('posts')
      .child('key/' + postKey);
    ref
      .update({
        heading: values.heading,
        description: values.description,
        location: values.location,
      })
      .then(snapshot => {
        values.id = snapshot.id;
        snapshot.set(values);
      });
  }

  return (
    <View style={styles.container}>
      <Formik
        initialValues={{
          heading: post.heading,
          description: post.description,
          location: post.location,
        }}
        mapPropsToValues={post => ({
          heading: post.heading,
          description: post.description,
          location: post.location,
        })}
        enableReinitialize={true}
        onSubmit={(values, post) => {
          console.log(values);
          updatePost({
            heading: values.heading,
            description: values.description,
            location: values.location,
          });
        }}>
        {props => (
          <View>
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Give your post a title'}
              onChangeText={props.handleChange('heading')}
              value={props.values.heading}
            />
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Tell us about your leftovers...'}
              onChangeText={props.handleChange('description')}
              value={props.values.description}
            />
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Where can we get our grub?'}
              onChangeText={props.handleChange('location')}
              value={props.values.location}
            />
            <TouchableOpacity
              style={formikstyles.button}
              title={'submit'}
              onPress={props.handleSubmit}>
              <Text style={formikstyles.btnText}>Submit</Text>
            </TouchableOpacity>
          </View>
        )}
      </Formik>
    </View>
  );
}

我尝试使用.key 提取 id (postKey)，但它读取为未定义。 有没有办法检索这个参数？

Answer 1

编辑了我的 addPost function 以手动生成唯一 ID，然后将该 uid 存储在数据库中名为“id”的字段中。

export function addPost(values, addComplete) {
  const key = Firebase.database()
    .ref('posts')
    .push().key;
  return Firebase.database()
    .ref('posts/' + key)
    .set({
      id: key,
      heading: values.heading,
      description: values.description,
      location: values.location,
    })
    .then(snapshot => {
      values.Id = snapshot.Id;
      snapshot.set(values);
    })
    .then(() => addComplete(values))
    .catch(error => console.log(error));
}

现在可以通过导航和 map 访问 uid 到路径引用以获取指定的帖子 object：

import React from 'react';
import {
  StyleSheet,
  Button,
  TextInput,
  View,
  Text,
  TouchableOpacity,
} from 'react-native';
import {Formik} from 'formik';
import {styles} from './PostList';
import Firebase from 'firebase';
import 'firebase/database';

export default function EditForm({route}) {
  const post = route.params;
  const postKey = post.post.id;
  const ref = Firebase.database().ref('posts/' + postKey);

  function updatePost(values) {
    ref
      .update({
        heading: values.heading,
        description: values.description,
        location: values.location,
      })
      .then(snapshot => {
        values.id = snapshot.id;
        snapshot.set(values);
      });
  }

  return (
    <View style={styles.container}>
      <Formik
        initialValues={{
          heading: post.heading,
          description: post.description,
          location: post.location,
        }}
        mapPropsToValues={post => ({
          heading: post.heading,
          description: post.description,
          location: post.location,
        })}
        enableReinitialize={true}
        onSubmit={(values, post) => {
          console.log(values);
          updatePost({
            heading: values.heading,
            description: values.description,
            location: values.location,
          });
        }}>
        {props => (
          <View>
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Give your post a title'}
              onChangeText={props.handleChange('heading')}
              value={props.values.heading}
            />
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Tell us about your leftovers...'}
              onChangeText={props.handleChange('description')}
              value={props.values.description}
            />
            <TextInput
              style={formikstyles.txtInput}
              placeholder={'Where can we get our grub?'}
              onChangeText={props.handleChange('location')}
              value={props.values.location}
            />
            <TouchableOpacity
              style={formikstyles.button}
              title={'submit'}
              onPress={props.handleSubmit}>
              <Text style={formikstyles.btnText}>Submit</Text>
            </TouchableOpacity>
          </View>
        )}
      </Formik>
    </View>
  );
}