javascript - 无法在 Hugo 静态站点生成器中将 JavaScript 变量作为参数传递
问题描述
我正在使用静态站点生成器 hugo。我有一些变量需要从 url 字符串中提取并存储在 localstorage 中。然后,我需要在整个站点的不同位置访问这些变量。
在 Hugo 中,我知道如何在 global.yml 文件中存储和访问全局变量,并且我还可以将变量传递到整个站点的局部变量中。但是,在这些情况下,我传入的变量必须定义为字符串或数字。例如,我可以访问全局变量,例如:
{{ .Site.Data.sitewide.global.randomTest }}
我什至可以在脚本标签中设置字符串,然后将它们作为变量传递:
<script>
{{ .Scratch.Set "greeting" "Hello" }}
</script>
但是,我的问题是我无法将 JavaScript 变量(例如来自 sessionStorage 的变量)作为可以访问、传递到 Hugo 部分或设置为全局变量的参数传递/插入。
有没有办法将 JavaScript 变量插入为 Hugo 变量,然后可以在整个静态站点中访问?
解决方案
我认为您需要将 Hugo 视为一个框架/库,而不是像 jQuery、React 或 PHP 等。
Hugo 只在构建时使用,而不是运行时。Hugo 在构建时使用自己的模板、部分等和变量(无论范围如何)来构建普通的旧 HTML。
现在,您可以包含任何 javascript,就像您在客户端上使网站动态化一样——如您所知,jQuery 就是一个很棒的库。因此,您需要考虑页面中的 javascript,以及如何使用它。
如果您查看任何 Hugothemes/*theme*/layouts/partials/header
或./footer
您看到包含的 javascript。这显然是您放置代码以在sessionStorage
任何您想要的地方访问和使用这些变量的地方。
如果您提供更多细节,我们可以帮助给出更具体的答案。
推荐阅读
- python - 根据熊猫中的计数从数据框中排除组
- reactjs - 使用 Enzyme 和 React 时输入未通过模拟更改更新
- python - 如何修复 Google Cloud ssh“模块‘时间’没有属性‘时钟’”?
- android - “无法加载资产:null”在我的颤振应用程序中
- varnish - 如何解决 Varnish FetchError“重用后端连接超时”
- tableau-api - 如何显示结果中的所有最小值、最大值、平均值和中值
- html - 如何让您的网站像 youtube 一样加载
- node.js - 将二进制文件保存到节点js中的图像文件
- javascript - 如何将子 Div 移动到另一个嵌套的非父 Div 中
- masm - MASM x86 中的 IF 和 ELSE IF 语句