{"action":"created","issue":{"url":"https://api.github.com/repos/japgolly/scalajs-react/issues/405","repository_url":"https://api.github.com/repos/japgolly/scalajs-react","labels_url":"https://api.github.com/repos/japgolly/scalajs-react/issues/405/labels{/name}","comments_url":"https://api.github.com/repos/japgolly/scalajs-react/issues/405/comments","events_url":"https://api.github.com/repos/japgolly/scalajs-react/issues/405/events","html_url":"https://github.com/japgolly/scalajs-react/issues/405","id":250691134,"number":405,"title":"What's the best way to modify state based on props?","user":{"login":"pnachum","id":2244653,"avatar_url":"https://avatars0.githubusercontent.com/u/2244653?v=4","gravatar_id":"","url":"https://api.github.com/users/pnachum","html_url":"https://github.com/pnachum","followers_url":"https://api.github.com/users/pnachum/followers","following_url":"https://api.github.com/users/pnachum/following{/other_user}","gists_url":"https://api.github.com/users/pnachum/gists{/gist_id}","starred_url":"https://api.github.com/users/pnachum/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pnachum/subscriptions","organizations_url":"https://api.github.com/users/pnachum/orgs","repos_url":"https://api.github.com/users/pnachum/repos","events_url":"https://api.github.com/users/pnachum/events{/privacy}","received_events_url":"https://api.github.com/users/pnachum/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-08-16T16:46:12Z","updated_at":"2017-08-16T18:13:59Z","closed_at":null,"body":"Sometimes the computation of new state should depend on the component's props. For example, if a `Counter` component accepts an `incrementAmount` prop that defines how much to increment its value by. \r\n\r\n```jsx\r\nclass Counter extends React.Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = { count: 0 };\r\n\r\n    this.increment = this.increment.bind(this);\r\n  }\r\n\r\n  increment() {\r\n    this.setState({\r\n      count: this.state.count + this.props.incrementAmount,\r\n    });\r\n  }\r\n  \r\n  render() {\r\n    return (\r\n      <div>\r\n        {this.state.count}\r\n        <button onClick={this.increment}>+</button>\r\n      </div>\r\n    )\r\n  }\r\n}\r\n\r\n<Counter incrementAmount={2} />\r\n```\r\n\r\nI'm wondering what's the best way to implement this in Scala.js. I think this works, but not sure if it's correct, or if there's a better alternative\r\n```scala\r\nclass Backend(bs: BackendScope[Int, Int]) {\r\n  def increment(): Callback =\r\n    bs.props.flatMap(incrementAmount => bs.modState(_ + incrementAmount))\r\n}\r\n```"},"comment":{"url":"https://api.github.com/repos/japgolly/scalajs-react/issues/comments/322855042","html_url":"https://github.com/japgolly/scalajs-react/issues/405#issuecomment-322855042","issue_url":"https://api.github.com/repos/japgolly/scalajs-react/issues/405","id":322855042,"user":{"login":"malaman","id":6554653,"avatar_url":"https://avatars0.githubusercontent.com/u/6554653?v=4","gravatar_id":"","url":"https://api.github.com/users/malaman","html_url":"https://github.com/malaman","followers_url":"https://api.github.com/users/malaman/followers","following_url":"https://api.github.com/users/malaman/following{/other_user}","gists_url":"https://api.github.com/users/malaman/gists{/gist_id}","starred_url":"https://api.github.com/users/malaman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/malaman/subscriptions","organizations_url":"https://api.github.com/users/malaman/orgs","repos_url":"https://api.github.com/users/malaman/repos","events_url":"https://api.github.com/users/malaman/events{/privacy}","received_events_url":"https://api.github.com/users/malaman/received_events","type":"User","site_admin":false},"created_at":"2017-08-16T18:13:59Z","updated_at":"2017-08-16T18:13:59Z","body":"This answer might help:\r\nhttps://github.com/japgolly/scalajs-react/issues/351"}}
{"actor":{"display_login":"malaman"}}