SYNC-HP用のサンプル
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

преди 2 години
преди 2 години
преди 2 години
преди 2 години
преди 2 години
1234567891011121314151617181920212223242526272829303132
  1. import React, { FC } from "react";
  2. import { fetchGuitars } from "../lib/strapi";
  3. import { GetServerSideProps } from "next";
  4. import { Guitar, GuitarResponse } from "../type/guitars";
  5. // ===========================
  6. // getServerSidePropsのpropsに設定したデータを引数で受け取れる
  7. // ==========================
  8. const Ssr: FC<GuitarResponse> = ({ guitars }) => {
  9. return (
  10. <div>
  11. {guitars.map((guitar: Guitar) => {
  12. return <div key={guitar.id}>{guitar.attributes.name}</div>;
  13. })}
  14. </div>
  15. );
  16. };
  17. // ===============================
  18. // サーバサイドレンダリング時にはgetServerSidePropsの中で
  19. // 表示データを作成する
  20. // ===============================
  21. export const getServerSideProps: GetServerSideProps = async () => {
  22. const guitars = await fetchGuitars();
  23. return {
  24. props: {
  25. guitars,
  26. },
  27. };
  28. };
  29. export default Ssr;