如何在Gatsby的GraphQL查询中使用regex匹配SKU,解决仅返回单节点问题
问题原因
- 正则匹配规则不符合预期:你在
gatsby-node.js中给页面上下文传递的sku参数是/${node.sku}/,等价于要求正则完全匹配当前商品的完整SKU,自然仅能返回当前商品这1个符合条件的节点。你在GraphiQL中测试时使用的是固定前缀/DW20DK18/,刚好有多个商品的SKU包含该片段,因此能返回多个结果。 - 存在语法错误:你代码中
sku:/${node.sku}/.toString().末尾多写了一个.,会导致传参异常。 - 正则写法不规范:Gatsby的GraphQL
regex过滤器不需要用/包裹正则内容,额外添加的斜杠会被当成匹配字符的一部分,进一步缩小了匹配范围。
解决方案
- 修正SKU传参逻辑,根据你的相似规则构造正则:
如果你需要匹配SKU前缀相同的相似商品(比如SKU前8位为同款标识),修改传参代码如下:
context: { id: node.id, // ^表示匹配SKU开头,提取前8位作为同款匹配规则 sku: `^${node.sku.slice(0, 8)}` }
如果你需要匹配SKU包含当前商品SKU任意片段的商品,修改传参代码如下:
context: { id: node.id, // 直接传递需要匹配的内容,不需要额外加斜杠包裹 sku: node.sku }
- 删除sku赋值行末尾多余的
.,修复语法问题。 - 如有需要,可以给正则添加忽略大小写的配置,修改查询语句的过滤规则:
allProductsCsv(filter: {sku: {regex: $sku, options: "i"}, instock: {eq: "TRUE"}})
内容的提问来源于stack exchange,提问作者vsoni
相关产品推荐
相关产品推荐

