Cloud firestore和nextjs - getInitialProps和async数据

Question

Im attempting to retrieve a document using the getInitialProps method from nextjs. However it is returning a Promise with a state 'pending'. Here is my code:

  static async getInitialProps(context) {
    const { id } = context.query;

    await db
      .collection('clients')
      .doc('JJqyDI8a1ILqnqmp2gcO')
      .get()
      .then(doc => ({
        data: doc.data(),
      }));

    console.log(data); // logs pending

    return {
      client: data,
    };
  }

I cant seem to find any examples either.

Answer 1

All async functions return a promise.

I don't see how you're accessing data because when you console.log it is already out of scope.

Do something like this:

  static async getInitialProps(context) {
    const { id } = context.query;

    const data = await db
      .collection('clients')
      .doc('JJqyDI8a1ILqnqmp2gcO')
      .get()
      .then(doc => ({
        ...doc.data(),
      }));


    return {
      client: data,
    };
  }

This should make it accessible by props.client