我正在 Shopify 的结账扩展 UI 上开发一个应用程序,我想使用目标“purchase.checkout.shipping-option-item.render-after”在 ShippingOptions 下显示一个横幅,在此横幅中我想显示自定义交货时间根据购物车中的商品、客户地址和shippingOption,我可以获取购物车中的商品和客户地址,但对于shippingOption,我只有它的名称和一个名为“handle”的长字符串,因为我认为使用“useShippingOptionTarget”可能很有用()”,但我需要 ShippingOption 的“DeliveryMethodDefinition”id,我可以使用“deliveryProfiles”从管理 GraphQL 获取该 ID,但我找不到一种将一个链接到另一个的方法
这是我的 jsx 文件
import {
Banner,
useApi,
useTranslate,
reactExtension,
useShippingOptionTarget,
} from '@shopify/ui-extensions-react/checkout';
export default reactExtension(
'purchase.checkout.shipping-option-item.render-after',
() => <Extension />,
);
function Extension() {
const translate = useTranslate();
const { extension } = useApi();
const shippingOption = useShippingOptionTarget();
console.log(shippingOption)
return (
<Banner title="checkout-ui">
{translate('welcome', { target: extension.target })}
</Banner>
);
}
我尝试使用名称进行链接,但是当有多个具有相同名称的商品时,我必须获取商品的价格和重量并计算选择哪一个,但如果有新商品或更新了 1 的内容,我必须更改代码,以便它不可维护。
我尝试使用句柄中的长字符串作为 ID(希望它会很有用),但找不到它的用途,因为我无能为力,而且我认为 Shopify 文档在事情变得有点不清楚时不清楚更难...
自 Shopify API 版本 2024-01 开始
TL;博士
不幸的是,您无法在 Checkout UI 扩展中获取 DeliveryMethodDefinition。
(也许在 Shopify Plus 商店上是可能的,我没有这些商店的经验)
详情
handle
属性似乎是根据name
计算的。它没有特殊字符,仅此而已。
多年来我们面临着同样的问题,我们还决定使用运费名称进行链接。 IMO 在按名称链接和按句柄链接之间,按名称链接更好。 考虑下面的 2 个运费名称:
两者很有可能拥有相同的手柄。 但实际上,运费并不相同,因此如果您通过句柄进行一些链接,您就会丢失信息。
其他一些知名的运输应用程序也使用名称来识别运输方式。