如何将数据从 Flask 传递到模板中的 JavaScript？

将数据从 Flask 传递到模板中的 JavaScript

使用 Flask 时，通常需要将数据从后端传递到前端以由 JavaScript 进行操作。这可以通过渲染模板来实现。

将数据传递给 JavaScript

Flask 使用的 Jinja2 模板引擎允许我们直接在模板中访问 Python 变量。要将变量从 Python 传递到 JavaScript，只需用双大括号 {{ }} 将其括起来：

<code class="html">
  <script>
    var myVariable = '{{ my_python_variable }}';
  </script>
</code>

示例：传递地理空间数据

考虑以下场景，我们要传递模板中 Google Maps API 的地理坐标字典：

<code class="python"># Assuming 'events' is a dictionary
geocode = event['latitude'], event['longitude']
return render_template('my_template.html', geocode=geocode)</code>

要在 JavaScript 中提供此数据，我们可以使用 Jinja2：

<code class="html">
  <script>
    var lat = '{{ geocode[0] }}';
    var lng = '{{ geocode[1] }}';
  </script>
</code>

替代方案：使用 tojson 过滤器

Jinja2 提供了一个 tojson 过滤器，可以将 Python 对象转换为 JSON 字符串，可以直接嵌入到 JavaScript 变量中：

<code class="html"><script>
  var geocode = {{ geocode|tojson }};
</script></code>

以上是如何将数据从 Flask 传递到模板中的 JavaScript？的详细内容。更多信息请关注PHP中文网其他相关文章！