S
SolidJS•11mo ago
pao ramen

How do I "curry" a function with props?

I have a method "colorize" that receives two arguments: hue and shade. A component has a props.hue and I want to curry that function. I can't do it with createMemo since the accessor does not receive a parameter. How would you do it? ``` function colorize(hue, shade) { ... } function Component(props: Props) { const color = colorize.bind(null, props.hue) // not reactive! return <span color={color(100)}>hello</span> }
2 Replies
Brendonovich
Brendonovich•11mo ago
either take in hue as an accessor or don't use bind 
function colorize(hue, shade) { ... }

function Component(props: Props) {
  const color = colorize.bind(null, () => props.hue) // accessor
  const color = (shade: number) => colorize(props.hue, shade) // no bind

  return <span color={color(100)}>hello</span>
}
function colorize(hue, shade) { ... }

function Component(props: Props) {
  const color = colorize.bind(null, () => props.hue) // accessor
  const color = (shade: number) => colorize(props.hue, shade) // no bind

  return <span color={color(100)}>hello</span>
}
the latter approach allows you to use createMemo too, i'm not sure if u want to make colorize take an accessor or not
pao ramen
pao ramenOP•11mo ago
makes sense! thanks for your help

Did you find this page helpful?