註:22 Jan 2023 更新:我剛發現在最新版的 Astro 中(以前的版本沒有這個問題..),這個方法已經無法使用了。不確定為什麼,在 Google 上也找不到相關的捲動錯誤,而且我也沒有時間去弄清楚。所以現在我改用在
config.mjs
文件中寫入,並載入該文件而不是astro.config.mjs
。
我有一個全局的標誌,當標誌為 true
時,我想要顯示一些內容。如果為 false
,則希望該信息被隱藏,這涉及到多個頁面組件。
因此,只需更改一個標誌,就可以改變整個網站的外觀。
這是我所做的。
我把該標誌放在 astro.config.mjs
中:
export default /\*\* @type {import('astro').AstroUserConfig} \*/ ({
renderers: ['@astrojs/renderer-react'],
devOptions: {
tailwindConfig: './tailwind.config.cjs',
},
signupsOpen: false,
})
請注意最後一個項目 signupsOpen
。這是我添加的項目。
然後,在我想使用該標誌的每個組件中引用它。
類似於以下方式:
---
import Config from '../../astro.config.mjs'
---
<div>
{Config.signupsOpen && <p>標誌為 true</p>}
</div>