SolidJS•4mo ago

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•4mo 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•4mo ago

makes sense! thanks for your help

Gaming

Programming

How do I "curry" a function with props?