Получение определенного объекта / предмета по идентификатору в Firebase

Question

В настоящее время я создаю небольшое веб-приложение с Firebase и React, но у меня возникают проблемы с извлечением определенных элементов в Firebase со стороны клиента React.

При этом я привык к javascript, где простая выборка может выглядеть примерно так:

const url = 'www.example.com/api/'
const id = '123'
fetch(url + id) <---specific
  .then(res => res.json())
  .then(result => this.setState({results: result})
  .catch(err => console.log(err))

Однако я не смог найти никакой документации по чему-то, чтовыглядит похоже с firebase.

Более конкретная проблема ниже:

class StoryItem extends Component {
   constructor(props) {
   super(props);
    this.state = {
      story: this.props.location.myCustomProps
    };
   }
 componentDidMount() {
   //this should do a fetch request based on the 
  //params id to get the specific item in the firebase
  //right now it is being passed as prop which is unreliable because when page refresh state is reset

  //user should be able to access content 
  //without having to go to previous page
console.log(this.state.story)
}

Один способ, которым я пытался получить конкретный объект из firebase, таков:

 componentDidMount(props) {
   const ref = firebase.database().ref("items");
   ref.on("value", snapshot => {
    let storiesObj = snapshot.val();
     storiesObj
      .child(this.props.match.params.id)
      .then(() => ref.once("value"))
      .then(snapshot => snapshot.val())
      .catch(error => ({
         errorCode: error.code,
         errorMessage: error.message
       }));

     });
   }

В этом случае ошибка:

Буду признателен за любую помощь, а также, если кто-нибудь знает какую-либо хорошую документацию по firebase, не стесняйтесь присылать мне ссылку.

Спасибо

Answer 1

Хитрость в том, что вам не нужно сначала получать стоимость всех предметов, как вы это делаете.Вы должны найти items ref, затем найти нужного вам ребенка и получить значение этого ребенка с .on или .once.

Что-то в этом роде, основываясь на вашем примере кода:

componentDidMount() {
   firebase.database().ref("items");
      .child(this.props.match.params.id)
      .once("value")
      .then(snapshot => snapshot.val())
      .catch(error => ({
         errorCode: error.code,
         errorMessage: error.message
       }));
   }

Для лучшего понимания давайте взглянем на оригинальный код и попытаемся выяснить, почему он выдает ошибку:

componentDidMount(props) {
   // ⬇️ this ref points to ALL items
   const ref = firebase.database().ref("items");

   // ⬇️ here we're asking for the value stored under the above ref
   ref.on("value", snapshot => {
    let storiesObj = snapshot.val();
     /* so firebase gives us what we ask for, storiesObj
      * is probably a huge js object with all the items inside.
      * And since it's just a regular js object, 
      * it does not have a `child` method on it, thus calling .child errors out.
      */
     storiesObj
      .child(this.props.match.params.id)
      .then(() => ref.once("value"))
      .then(snapshot => snapshot.val())
      .catch(error => ({
         errorCode: error.code,
         errorMessage: error.message
       }));

     });
   }