javascript - 在 Javascript 中访问 Shopify Liquid 变量

Question

我的问题是，是否可以使用 Javascript 访问 Shopify Liquid 中的变量？

{% assign my_array= "apples, oranges, peaches, tomatoes" | split: ", " %}


function my_function(number){
    return "{{my_array[number]}}";
  }

  $('#click_me').click(function(){
    alert(my_function(0));
  });

我知道这可以通过 AJAX 和 PHP 实现，但是是否有类似的方法可以单独使用 Shopify Liquid 和 JQuery 来实现？

Answer 1

Liquid 是一种后端临时语言，这意味着它在 Javascript 之前渲染。这意味着一旦液体渲染完成，您将无法访问液体逻辑，并且由于 JS 是在液体之后渲染的，这意味着您根本无法访问它。

所以你无法将JS变量实时传递给liquid。

但是你可以用liquid创建一个JS对象:

{% assign my_array= "apples, oranges, peaches, tomatoes" | split: ", " %}

var my_array = {{ my_array | json }};
function my_function(number){
  return "my_array[number]";
}

$('#click_me').click(function(){
  alert(my_function(0));
});

您可以使用 AJAX 来获取特定页面，但从您的示例来看，这对您没有任何好处，因为您试图访问 Javascript 事件上的液体变量，这是不可能的。