{"comment":{"url":"https://api.github.com/repos/Soundnode/soundnode-app/comments/14239361","html_url":"https://github.com/Soundnode/soundnode-app/commit/fcded4a3a6d2617c49b74a7904f3e361d5957a9f#commitcomment-14239361","id":14239361,"user":{"login":"sergeylaptev","id":5740795,"avatar_url":"https://avatars.githubusercontent.com/u/5740795?v=3","gravatar_id":"","url":"https://api.github.com/users/sergeylaptev","html_url":"https://github.com/sergeylaptev","followers_url":"https://api.github.com/users/sergeylaptev/followers","following_url":"https://api.github.com/users/sergeylaptev/following{/other_user}","gists_url":"https://api.github.com/users/sergeylaptev/gists{/gist_id}","starred_url":"https://api.github.com/users/sergeylaptev/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sergeylaptev/subscriptions","organizations_url":"https://api.github.com/users/sergeylaptev/orgs","repos_url":"https://api.github.com/users/sergeylaptev/repos","events_url":"https://api.github.com/users/sergeylaptev/events{/privacy}","received_events_url":"https://api.github.com/users/sergeylaptev/received_events","type":"User","site_admin":false},"position":22,"line":47,"path":"app/public/js/components/header/settingsNav.jsx","commit_id":"fcded4a3a6d2617c49b74a7904f3e361d5957a9f","created_at":"2015-11-06T12:06:16Z","updated_at":"2015-11-06T12:06:16Z","body":"This isn't best practice in es6 syntax case. Everytime when component rerender itself bind function will create new instance which is bound to `this` context. There are 2 possible solutions:\r\nThe first one\r\n```jsx\r\nclass MyComponent extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.toggleSettings = this.toggleSettings.bind(this);\r\n  }\r\n  render() {\r\n    return (\r\n      <SettingsButton onClick={this.toggleSettings} />\r\n    );\r\n  }\r\n}\r\n```\r\nThe second one\r\n```jsx\r\nclass MyComponent extends Component {\r\n  toggleSettings = () => {\r\n    ...\r\n  }\r\n  render() {\r\n    return (\r\n      <SettingsButton onClick={this.toggleSettings} />\r\n    );\r\n  }\r\n}\r\n```"}}