1

What does the double colon in ::this.handleClick do and how does it work? I'm guessing its an alternate syntax to this.handleClick.bind(this)

return <Map ref='map'
      center={this.state.latlng}
      zoom={13}
      onClick={::this.handleClick}
      onLocationfound={::this.handleLocationFound}
      length={4}>
      <TileLayer
        url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'
        attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
      />
      {marker}
    </Map>;

https://github.com/PaulLeCam/react-leaflet/blob/master/example/events.js#L39-L40

Luqmaan
  • 2,052
  • 27
  • 34
  • 1
    This was addressed here: http://stackoverflow.com/questions/31220078/javascript-double-colon-es7-proposal But I believe the complex thing here is the {} wrapped around it. I think it is taking the named function and passing it as a properties of an object binded to the context of this {handleClick: this.handleClick.bind(this)} – Dustin Moore Jul 27 '15 at 16:54
  • 2
    @DustinMoore the `{...}` is actually just JSX syntax [for using a JavaScript expression as an attribute value](https://facebook.github.io/react/docs/jsx-in-depth.html#attribute-expressions). – jmar777 Jul 27 '15 at 17:00
  • 1
    Also binding handler functions etc inside render calls isn't the best way to bind. This will cause the bind call to be executed on the function every render cycle and return a new function every time. It's better to bind the functions (if needed) in the class constructor. That way the function is bound once, and subsequent render cycles just refer to the same function ref. – Mike Driver Jul 27 '15 at 23:51

0 Answers0