💨 Nuxt.js + WP REST API で静的サイトをビルドする際の各ページへのデータ受け渡し方法

//...

generate: {
  interval: 1000,
  async routes() {
    const baseURL = "https://<site-url>";
    const [posts, pages] = await Promise.all([
      axios
        .get(`${baseURL}/wp-json/wp/v2/posts`)
        .then(response => {
          return response.data;
        })
        .catch(error => {
          return { error: error };
        }),
      axios
        .get(`${baseURL}/wp-json/wp/v2/pages`)
        .then(response => {
          return response.data;
        })
        .catch(error => {
          return { error: error };
        })
    ]);
    let post_routes = posts.map(page => {
      return {
        route: "/posts/" + page.id,
        payload: { page }
      };
    });
    let page_routes = pages.map(page => {
      return {
        route: "/" + encodeURI(page.slug),
        payload: { page }
      };
    });
    return [...post_routes, ...page_routes];
  }
}

//...

async asyncData ({ $axios, params, error, payload }) {
  if (payload) return { post: payload }
  const baseURL = "https://<site-url>";
  const endpoint = `${baseURL}/wp-json/wp/v2/posts/${params.id}`;
  return await $axios
    .get(endpoint)
    .then(response => {
      return { post: response.data };
    })
    .catch(error => {
      return { error: error };
    });
}

async asyncData ({ $axios, params, error, payload }) {
  if (payload) return { post: payload }
  const baseURL = "https://<site-url>";
  const endpoint = `${baseURL}/wp-json/wp/v2/?slug=${encodeURI(params.slag)}`;
  return await $axios
    .get(endpoint)
    .then(response => {
      return { post: response.data };
    })
    .catch(error => {
      return { error: error };
    });
}

export default function ({ $axios }) {
  $axios.defaults.baseURL = "https://<site-url>";
}