#How do I "curry" a function with props?

3 messages · Page 1 of 1 (latest)

fleet kite
#

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>
}
acoustic marten
#

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>
}
#

the latter approach allows you to use createMemo too, i'm not sure if u want to make colorize take an accessor or not