{"action":"created","issue":{"url":"https://api.github.com/repos/rackt/react-router/issues/835","labels_url":"https://api.github.com/repos/rackt/react-router/issues/835/labels{/name}","comments_url":"https://api.github.com/repos/rackt/react-router/issues/835/comments","events_url":"https://api.github.com/repos/rackt/react-router/issues/835/events","html_url":"https://github.com/rackt/react-router/issues/835","id":57661232,"number":835,"title":"Eliminate Navigation/State mixins","user":{"login":"mjackson","id":92839,"avatar_url":"https://avatars.githubusercontent.com/u/92839?v=3","gravatar_id":"","url":"https://api.github.com/users/mjackson","html_url":"https://github.com/mjackson","followers_url":"https://api.github.com/users/mjackson/followers","following_url":"https://api.github.com/users/mjackson/following{/other_user}","gists_url":"https://api.github.com/users/mjackson/gists{/gist_id}","starred_url":"https://api.github.com/users/mjackson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mjackson/subscriptions","organizations_url":"https://api.github.com/users/mjackson/orgs","repos_url":"https://api.github.com/users/mjackson/repos","events_url":"https://api.github.com/users/mjackson/events{/privacy}","received_events_url":"https://api.github.com/users/mjackson/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/rackt/react-router/labels/enhancement","name":"enhancement","color":"84b6eb"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":20,"created_at":"2015-02-13T22:13:57Z","updated_at":"2016-01-22T03:27:17Z","closed_at":"2015-02-24T22:40:18Z","body":"It's becoming clear that mixins are not the way forward in React, so we need to get rid of the mixins we have, or at least deprecate them and recommend alternative methods. Fortunately, this won't be very difficult for us since both `Router.Navigation` and `Router.State` just delegate all methods to methods with the same name in `context` that are passed down from the router instance.\r\n\r\nI propose that we move the actual router object into context. Then, when you need to make a path or do some navigation you just use `this.context.router.transitionTo` instead of `this.transitionTo`.\r\n\r\nSo this\r\n\r\n```js\r\nvar MyHandler = React.createClass({\r\n  mixins: [ Router.Navigation ],\r\n  handleSomeEvent: function () {\r\n    this.transitionTo( ... );\r\n  }\r\n  // ...\r\n});\r\n```\r\n\r\nbecomes this\r\n\r\n```js\r\nvar MyHandler = React.createClass({\r\n  contextTypes: {\r\n    router: Router.PropTypes.router.isRequired\r\n  },\r\n  handleSomeEvent: function () {\r\n    this.context.router.transitionTo( ... );\r\n  }\r\n  // ...\r\n});\r\n```\r\n\r\nNote: This will also help us greatly slim down the number of properties we have on context (see #744)\r\n\r\nWe should also deprecate the use of `Router.Navigation` and `Router.State` and emit warnings when people use them."},"comment":{"url":"https://api.github.com/repos/rackt/react-router/issues/comments/173794207","html_url":"https://github.com/rackt/react-router/issues/835#issuecomment-173794207","issue_url":"https://api.github.com/repos/rackt/react-router/issues/835","id":173794207,"user":{"login":"zzzbj","id":13026378,"avatar_url":"https://avatars.githubusercontent.com/u/13026378?v=3","gravatar_id":"","url":"https://api.github.com/users/zzzbj","html_url":"https://github.com/zzzbj","followers_url":"https://api.github.com/users/zzzbj/followers","following_url":"https://api.github.com/users/zzzbj/following{/other_user}","gists_url":"https://api.github.com/users/zzzbj/gists{/gist_id}","starred_url":"https://api.github.com/users/zzzbj/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zzzbj/subscriptions","organizations_url":"https://api.github.com/users/zzzbj/orgs","repos_url":"https://api.github.com/users/zzzbj/repos","events_url":"https://api.github.com/users/zzzbj/events{/privacy}","received_events_url":"https://api.github.com/users/zzzbj/received_events","type":"User","site_admin":false},"created_at":"2016-01-22T03:27:17Z","updated_at":"2016-01-22T03:27:17Z","body":"var MyHandler = React.createClass({\r\nes6:\r\nexport class MyHandler extends React.Component {\r\n\r\nthen \r\ncontextTypes: {\r\n    router: Router.PropTypes.router.isRequired\r\n  },\r\nnot work"}}