如何在 astro JS 中使用文档和窗口元素？

【问题标题】：How to use document and window element in astro JS?如何在 astro JS 中使用文档和窗口元素？
【发布时间】：2022-08-19 06:22:35
【问题描述】：

我想使用窗口或文档来返回当前页面默认 Astro.site.pathname 的路径无法正常工作或没有正确的文档可用。

我的问题是如何在 Astro JS 中正确使用文档或窗口？

提前致谢！

标签： javascript node.js reactjs jsx astrojs

【解决方案1】：

如果你想使用window 或document 之类的东西，你需要在<script is:inline></script> 中编写脚本。这样，Astro 就不会触及您的 JS 并将其直接包含在 HTML 中。位于页面顶部--- --- 之间的 JS 将在构建时执行。

【讨论】：

【解决方案2】：

默认情况下，Astro 将处理、优化和捆绑它在页面上看到的任何标签。您可以使用 is:inline 指令选择退出此行为。

– Docs

您可以在 .astro 组件中使用 is:inline 指令，如下所示：
---
// static build only
---

<script is:inline>
    console.log(document, window)
</script>

【讨论】：

【解决方案3】：

您还可以使用const { pathname } = Astro.url 访问当前路径名。

【讨论】：