{"action":"created","issue":{"url":"https://api.github.com/repos/react-community/react-navigation/issues/1114","repository_url":"https://api.github.com/repos/react-community/react-navigation","labels_url":"https://api.github.com/repos/react-community/react-navigation/issues/1114/labels{/name}","comments_url":"https://api.github.com/repos/react-community/react-navigation/issues/1114/comments","events_url":"https://api.github.com/repos/react-community/react-navigation/issues/1114/events","html_url":"https://github.com/react-community/react-navigation/issues/1114","id":222669547,"number":1114,"title":"invoke method after navigate ","user":{"login":"Catharsis68","id":6165055,"avatar_url":"https://avatars0.githubusercontent.com/u/6165055?v=3","gravatar_id":"","url":"https://api.github.com/users/Catharsis68","html_url":"https://github.com/Catharsis68","followers_url":"https://api.github.com/users/Catharsis68/followers","following_url":"https://api.github.com/users/Catharsis68/following{/other_user}","gists_url":"https://api.github.com/users/Catharsis68/gists{/gist_id}","starred_url":"https://api.github.com/users/Catharsis68/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Catharsis68/subscriptions","organizations_url":"https://api.github.com/users/Catharsis68/orgs","repos_url":"https://api.github.com/users/Catharsis68/repos","events_url":"https://api.github.com/users/Catharsis68/events{/privacy}","received_events_url":"https://api.github.com/users/Catharsis68/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-04-19T09:07:41Z","updated_at":"2017-04-21T07:59:54Z","closed_at":"2017-04-21T07:59:54Z","body":"Hey guys,\r\n\r\nI made a small sample application with react native, `react navigation` and `react-native-maps`.\r\n\r\nI use a TabNavigator for the three screens:\r\n\r\n|-App\r\n|-- List\r\n|-- Map\r\n|-- Settings\r\n\r\nEach list item has coordinates for an map marker. I want to change the screen from the list to map and invoke a method to change to the new region.\r\n\r\nI implemented this function within the list container\r\n\r\n```\r\nshowItemOnMap = (item) => {\r\n    const { navigate } = this.props.navigation\r\n    navigate('Map', {item: item})\r\n  }\r\n```\r\n\r\nAny ideas how to invoke a method from that? \r\n\r\n\r\n\r\nI think I have to provide more information about the structure of my app.\r\n```\r\n| App.js // is the entry point of the application, \r\n| - app \r\n|     |- containers/\r\n|           |- Router.js // react navigator\r\n|           |- List.js // compose all list components\r\n|           |- Map.js // compose all map components\r\n|     |- components\r\n|           |-list \r\n|               |- List.js // displays all the items in a list\r\n|               |- ListDetail.js         \r\n|           |- map\r\n|               |- Map.js\r\n```\r\n\r\n`components/map/Map.js` render func\r\n```\r\nrender() {\r\n    const { items } = this.props \r\n    const { region } = this.state;\r\n    return (\r\n      <View style={styles.container}>\r\n        <MapView\r\n          ref={ref => { this.map = ref; }}\r\n          style={styles.map}\r\n          initialRegion={region}\r\n          zoomEnabled={true}\r\n          pitchEnabled={false}\r\n\r\n        >\r\n          {items.map((item, index) => (\r\n            <MapView.Marker\r\n              style={styles.marker}\r\n              key={index}\r\n              coordinate={item.coordinate}\r\n              title={item.name.first}\r\n              description={item.info}              \r\n            />\r\n          ))}\r\n        </MapView>        \r\n      </View>\r\n    );\r\n  }\r\n```\r\n\r\n`components/map/Map.js`\r\n```\r\nanimateTo(item) {    \r\n    this.map.animateToCoordinate({\r\n       latitude: item.coordinate.latitude,\r\n       longitude: item.coordinate.longitude\r\n    }, 2);\r\n}       \r\n```\r\n\r\n`containers/List.js`\r\nhere I handle the touch event of each item. \r\n```\r\nshowItemOnMap = (item) => {\r\n    const { navigate } = this.props.navigation\r\n    navigate('Map', {item: item})\r\n}\r\n```\r\n\r\nThe code above works so far, but how can I access the `animateTo` in navigate() function\r\nfrom `components/map/Map.js`? \r\n\r\n\r\nconst { params } = this.props.navigation.params doesn't work.\r\n\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/react-community/react-navigation/issues/comments/296116583","html_url":"https://github.com/react-community/react-navigation/issues/1114#issuecomment-296116583","issue_url":"https://api.github.com/repos/react-community/react-navigation/issues/1114","id":296116583,"user":{"login":"Catharsis68","id":6165055,"avatar_url":"https://avatars0.githubusercontent.com/u/6165055?v=3","gravatar_id":"","url":"https://api.github.com/users/Catharsis68","html_url":"https://github.com/Catharsis68","followers_url":"https://api.github.com/users/Catharsis68/followers","following_url":"https://api.github.com/users/Catharsis68/following{/other_user}","gists_url":"https://api.github.com/users/Catharsis68/gists{/gist_id}","starred_url":"https://api.github.com/users/Catharsis68/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Catharsis68/subscriptions","organizations_url":"https://api.github.com/users/Catharsis68/orgs","repos_url":"https://api.github.com/users/Catharsis68/repos","events_url":"https://api.github.com/users/Catharsis68/events{/privacy}","received_events_url":"https://api.github.com/users/Catharsis68/received_events","type":"User","site_admin":false},"created_at":"2017-04-21T07:59:54Z","updated_at":"2017-04-21T07:59:54Z","body":"solved this problem, further information in this [Topic at react-native-maps](https://github.com/airbnb/react-native-maps/issues/1255#issuecomment-295680285)"}}
{"actor":{"display_login":"Catharsis68"}}