如何将Shopify Liquid对象赋值给JavaScript变量并获取可用对象？

直接通过{{ customer }}输出Liquid对象时，得到的是它的Drop类型字符串标识（比如CustomerDrop），没法直接作为JavaScript对象使用。解决方法是用Liquid自带的json过滤器，把Liquid对象序列化为合法的JSON结构后再赋值给JS变量：

<script>
  const customer = {{ customer | json }};
  console.log(customer);
</script>

关键细节： #

• json过滤器会自动把Liquid对象转换成符合JS语法的JSON字符串，不需要额外给变量添加单引号或双引号
• 转换完成后，你可以直接访问对象的属性，比如customer.email、customer.first_name
• 如果要处理用户未登录（customer为null）的场景，可以加默认值处理：

  <script>
    const customer = {{ customer | default: nil | json }};
    if (customer) {
      console.log('当前用户邮箱:', customer.email);
    } else {
      console.log('用户未登录');
    }
  </script>
  

内容的提问来源于stack exchange，提问作者Abid Hasan