K-POP積水試験項目回顧
7991 ワード
n/a.ターゲット
週
Tailwind CSSの弱点
例えば、
The Open GraphプロトコルとSSR/SGの使用
className="w-[${value}px]"
で動的にテストurl(動的ルーティング)を作成してogに関連するラベル(testIdの値に依存)を動的にレンダリングしたので、最初のプレビュー(og画像)は正しく表示されませんでした.export const getStaticPaths: GetStaticPaths = () => {
return {
paths: [{params: {testId: "food"}}, {params: {testId: "knowledge"}}],
fallback: true,
};
}
export const getStaticProps: GetStaticProps = (context) => {
const testId = context?.params?.testId || ""
return {
props: {
testId: testId === "food" ? "food" : "knowledge"
},
}
}
残念ながらクエリ値はgetStaticPropsでは解決できません
export const getServerSideProps: GetServerSideProps = async (context) => {
const testId = context?.params?.testId || ""
const scoreParam = context?.query?.s || ""
const encryptedScore = typeof scoreParam === "string" ? scoreParam : ""
const decryptedScore = // descrypt encryptedScore
return {
props: {
testId: testId === "food" ? "food" : "knowledge",
defaultScore: decryptedScore
},
}
}
Reference
この問題について(K-POP積水試験項目回顧), 我々は、より多くの情報をここで見つけました https://velog.io/@vltea/케이팝-고인물-테스트-프로젝트-회고テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol