Как отображать данные в порядке времени их создания с помощью Firebase Web - PullRequest
2 голосов
/ 15 января 2020

Я знаю, что это не очень сложно, но я только начинаю с firebase. И мой вопрос заключается в том, как я могу отображать данные в том порядке, в котором они были созданы с помощью Firebase. В настоящее время я заказываю по названию.

Вот как я пишу в своей базе данных и затем отображаю

// displaying and deleting data

function renderCafe(doc) {
  let li = document.createElement('li')
  let name = document.createElement('name')
  let phone = document.createElement('phone')
  let specialist = document.createElement('specialist')
  let data = document.createElement('data')
  let cross = document.createElement('div')
  
  
  li.setAttribute('data-id', doc.id)
  name.textContent = doc.data().name;
  phone.textContent = doc.data().phone;
  specialist.textContent = doc.data().specialist;
  data.textContent = doc.data().data;
  cross.textContent = 'x';
  
  
  li.appendChild(name);
  li.appendChild(phone);
  li.appendChild(specialist);
  li.appendChild(data);
  li.appendChild(cross);
  
  

  doctorList.appendChild(li);

  //deleting data

  cross.addEventListener('click', (e) => {
    e.stopPropagation();
    let id = e.target.parentElement.getAttribute('data-id');
    db.collection('patients').doc(id).delete();
  })
} 

  
  // real-time listener 
  const doctorList = document.querySelector('.patients');

  db.collection('patients').onSnapshot(snapshot => {
    let changes = snapshot.docChanges();
    changes.forEach(change => {
      if(change.type == 'added') {
        renderCafe(change.doc);
      } else if (change.type == 'removed') {
        let li = doctorList.querySelector('[data-id=' + change.doc.id +']');
        doctorList.removeChild(li);
      }
    })
  })

Так я создаю документы

const createForm1 = document.querySelector('#patient');
createForm1.addEventListener('submit', (e) => {
  e.preventDefault();

  db.collection('patients').add({
    name: createForm1['name'].value,
    phone: createForm1['phone'].value,
    specialist: createForm1['specialist'].value,
    data: createForm1['date'].value
    
  }).then(() =>{

   //clear data
    document.getElementById('patient').reset();

    document.querySelector('.alert1').style.display='block';
        // Hide alert after 3 seconds
        setTimeout(function(){
        document.querySelector('.alert1').style.display='none';
        },3000);
  })
})

1 Ответ

4 голосов
/ 15 января 2020

Вы можете добавить Серверную метку в свои patients документы (например, назовите ее timestamp), а затем использовать ее для сортировки документов.

Как это работает : Когда вы пишете firebase.firestore.FieldValue.serverTimestamp() в каком-либо свойстве документа, оно заменяется серверной меткой времени (числом) в базе данных, поэтому вы можете использовать ее для сортировки.

Редактировать: В добавленном вами коде выполните как то так:

db.collection('patients').add({
  name: createForm1['name'].value,
  phone: createForm1['phone'].value,
  specialist: createForm1['specialist'].value,
  data: createForm1['date'].value,
  timestamp: firebase.firestore.FieldValue.serverTimestamp()
  // or timestamp: Date.now(), if you trust the client's clock
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...