These are chat archives for ramda/ramda

8th
Apr 2015
Ludwig Magnusson
@TheLudd
Apr 08 2015 09:16
I just created a future wrapper for the superagent request library if anyone is interested. Using ramda-fantasy under the hood https://www.npmjs.com/package/superagent-future
Chad Adams
@chadams
Apr 08 2015 13:22
what would be a more functional way of doing this?
        {this.props.items.map(function(item, i) {
          return (
            <div onClick={this.handleClick.bind(this, i)} key={i}>{item}</div>
          );
        }, this)}
Ludwig Magnusson
@TheLudd
Apr 08 2015 13:27
Step 1: Don't mutate it.
var elements = R.mapIndexed(function(item, i) {
  return <div onClick={this.handleClick.bind(this, i)} key={i}>{item}</div>
}.bind(this), this.props.items)
Raine Virta
@raine
Apr 08 2015 13:28
is he mutating it..?
Ludwig Magnusson
@TheLudd
Apr 08 2015 13:29
ah maybe not
Chad Adams
@chadams
Apr 08 2015 14:12

the

.bind(this)

seems really weird, I would like to pass this in, so I can reuse this curried function.

is something like this possible?
var elements = R.mapIndexed(function(item, i, ref) {
  return <div onClick={ref.handleClick.bind(ref, i)} key={i}>{item}</div>
}, this, this.props.items)
Ludwig Magnusson
@TheLudd
Apr 08 2015 14:17
put ref first and curry the function
var theFn = R.curry(function(ref, item, i) {
  return <div onClick={ref.handleClick.bind(ref, i)} key={i}>{item}</div>
});
var elements = R.mapIndexed(theFn(this), this.props.items)
Scott Sauyet
@CrossEye
Apr 08 2015 23:39

@chadams: I don't really know the syntax. (Is that React's JSX?) But something like this might be more functional:

return (
    <div onClick={makeClickHandler(item, i)} key={i}>{item}</div>
);

where makeClickHandler returns a function that deals only with item and i and has nothing to do with this. Is that the sort of thing you're looking for? Then you might consider @TheLudd's point about the outer control of the loop...