Skip to main content

mapSelectedProductOptionToObject
utility

Converts the product selected option into an Object<key, value> format for building URL query params

Was this section helpful?

MapSelectedProductOptionToObject.js

mapSelectedProductOptionToObject example

import {mapSelectedProductOptionToObject} from '@shopify/hydrogen-react';

const selectedOption = [
{
name: 'Color',
value: 'Red',
},
{
name: 'Size',
value: 'Medium',
},
];

const optionsObject = mapSelectedProductOptionToObject(selectedOption);

// Output of optionsObject
// {
// Color: 'Red',
// Size: 'Medium',
// }

const searchParams = new URLSearchParams(optionsObject);
searchParams.toString(); // '?Color=Red&Size=Medium'

Anchor to relatedRelated

getProductOptions
getAdjacentAndFirstAvailableVariants
useSelectedOptionInUrlParam