Callback Functions
Callback Functions is Sledge's additional props (for Hydrogen/Next.js) and attributes (for Liquid/Webflow) you can use to execute your own function after Sledge function running.
Let's say you want to show a 'thank you' notification after customer adding a review you can feed your own function to props onAfterAddReview / using event listener like after-add-review.
Code Sample
import { SearchIconWidget } from "@sledge-app/react-instant-search";
export default function InstantSearchIconWidget() {
return (
<SearchIconWidget
size='sm'
onAfterAddWishlist={(state) => {
if (state) {
// if condition is state === true, run your custom code
} else {
// if condition is state === true, run your custom code
}
}}
onAfterRemoveWishlist={(state) => {
if (state) {
// if condition is state === true, run your custom code
} else {
// if condition is state === true, run your custom code
}
}}
onAfterRenderProduct={(state) => {
if (state) {
// if condition is state === true, run your custom code
} else {
// if condition is state === true, run your custom code
}
}}
/>
);
}List of Callback Functions
onAfterAddWishlist, see the API reference.onAfterRemoveWishlist, see the API reference.onAfterAddReview, see the API reference.onAfterAddToCart, see the API reference.onAfterRenderProduct, see the API reference.onAfterRenderCollectionsee the API referenceonAfterRenderPagesee the API referenceonAfterRenderBlogsee the API referenceonAfterRenderArticlesee the API reference