我设法创建了onLineAdd toast通知,每当有人添加东西到他们的购物车,但是,我似乎不能掌握如何显示产品信息,并显示在toast。
我正在寻找的是onLineAdd来触发一个通知,内容如下:"XXX(带图片)已添加到购物车。"这可能吗?
我的代码:
const open = useCallback(() => {
console.log("Opening product added popup, with image and title.")
}, []);
<ShopifyCartProvider
onLineAdd={open}
onCreate={open}>
{children}
</ShopifyCartProvider>
它甚至在官方的shopify氢存储器上实现:(尝试在此处向购物车添加内容)https://shopify.supply/products/entrepreneur-tee
2条答案
按热度按时间6l7fqoea1#
要在将产品添加到购物车时在toast通知中显示产品信息,您需要将必要的信息传递给onLineAdd回调函数。
一种方法是修改open回调函数以接受表示添加到购物车的产品的参数,然后使用此信息在toast通知中显示相应的产品信息。
您还需要修改ShopifyCartProvider组件,以便将必要的产品信息传递给onLineAdd回调函数。您可以通过访问传递给onLineAdd回调函数的事件负载中的产品信息来执行此操作。
例如:
4jb9z9bj2#
查看
CartProvider
的源代码(link),在我看来,这不太可能是用产品信息打开祝酒词这样的事情的预期位置,否则我会假设shopify devs不会简单地省略向“事件”方法传递任何信息/参数,比如onLineAdd
(不太确定那些没有传递任何上下文信息的方法有什么意义,但没有深入挖掘)。因此,我建议您研究其他组件,例如
AddToCartButton
(link)(或者您使用什么来触发onLineAdd
-事件?),它似乎更有可能提供您所需的信息:因此您可以提供自己
handleAddItem
方法来打开您的吐司,然后将其设置为defaultOnClick
属性?也许还有其他组件可以做同样的事情?
如果你坚持用你链接到的官方商店里的方法来做,也许比较一下github上
CartProvider
的源代码和他们在商店里用它做的事情(link)也会对如何做有所启发!PS:原谅我忽略了一些明显的东西,我从来没有用过shopify氢;)