Shopify 主题与 Liquid

Shopify render 的 with 与 for 参数用错导致数据为空

现象#

{% render 'card', with: product %} 之后 snippet 里 {{ card }} 是空的,改成 for 又只输出一次。

原因#

  • with 会把传入对象挂到与 snippet 同名的变量上,不是 product
  • 写成 with: product 时加了冒号,正确写法是 with product(不带冒号)
  • for 要求传入数组,传单个对象只会渲染一次且变量名同样被改名
  • snippet 里仍按外层变量名取值,没有用 render 的隔离作用域规则

处理步骤#

  1. 单对象用 {% render 'card', product: product %},显式命名最不容易错
  2. 需要批量时用 {% render 'card' for collection.products as product %},as 指定循环变量名
  3. 记住 render 是隔离作用域,snippet 内无法读取外层 assign 的变量,必须显式传
  4. 老代码里的 include 可以读外层变量,但已不推荐,迁移时逐个补参数

验收标准#

snippet 内部能取到传入对象,循环渲染时每项数据正确,不再出现空白卡片。

本文由 风格技术 技术团队整理,适用于 Shopify 标准版与 Plus 店铺。Shopify 平台能力迭代较快,具体操作路径与字段以官方文档和店铺后台实际版本为准。