Search code examples
typescriptnext.jssanity

How can I pass multiple data with GetServerSideProps


I'm trying to pass multiple sanity data into a component. but I can only use getserversideprops one time. how can I use more than one sanity data?

pages > members.tsx

export const getServerSideProps = async ({props}: any) => {

//HERE I NEED TO QUERY 4 MORE DATA // 
  const query = `*[ _type == "teammembers"] {
        _id,
        name,
        position,
        bordercolor,
        memberimage,
    }`;
 const members = await sanityClient.fetch(query);
 return { props: { members } };
};

const teammembers = ({ members }: any) => {
  return (
    <>
      <TeamMembersComponent members={members} />
    </>
  );
};

components > members.tsx

const TeamMembersComponent = ({ members }: any) => {
  return (
    <>
      <MembersContainer members={members} />
    </>
  );
};

other data that I need to use. for example

 const query = `*[_type == "projectschema" && slug.current == $id][0] {
     _id,
        title,
         categories[0] -> {
                  title,
          },
         date,
         website,
        thumbnail,
         client,
         company,
       description,
    }`;

Solution

  • You can change your query to something like:

    const query = `{
      'teamMembers': *[ _type == "teammembers"] {
        _id,
        name,
        position,
        bordercolor,
        memberimage,
      },
      'otherStuff': *[ _type != "teammembers"] {...}
    }`;
    

    Notice the queries are wrapped in {} and are each named (which is how you can access them).