Update NativeComponentsIOS.md
Summary: Updated map view example to correct and extend on change event management Thanks for submitting a pull request! Please provide enough information so that others can review your pull request: > **Unless you are a React Native release maintainer and cherry-picking an *existing* commit into a current release, ensure your pull request is targeting the `master` React Native branch.** Explain the **motivation** for making this change. What existing problem does the pull request solve? Prefer **small pull requests**. These are much easier to review and more likely to get merged. Make sure the PR does only one thing, otherwise please split it. **Test plan (required)** Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI. Make sure tests pass on both Travis and Circle CI. **Code formatting** Look around. Match the style of the rest of the codebase. See also the simple [style guide](https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md#style-guide). For more info, see the ["Pull Requests" section of our "Contributing" guidelines](https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md#pull-requests). Closes https://github.com/facebook/react-native/pull/12759 Differential Revision: D4962286 Pulled By: hramos fbshipit-source-id: 92cc41f100616d3b5633603cf69850ebc9fc33b2
This commit is contained in:
parent
0ff16f63dd
commit
0f025df582
|
@ -306,13 +306,14 @@ You can see we're adding an event handler property to the view by subclassing `M
|
||||||
|
|
||||||
class MapView extends React.Component {
|
class MapView extends React.Component {
|
||||||
constructor() {
|
constructor() {
|
||||||
|
super(props)
|
||||||
this._onChange = this._onChange.bind(this);
|
this._onChange = this._onChange.bind(this);
|
||||||
}
|
}
|
||||||
_onChange(event: Event) {
|
_onChange(event: Event) {
|
||||||
if (!this.props.onRegionChange) {
|
if (!this.props.onRegionChange) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.props.onRegionChange(event.nativeEvent.region);
|
this.props.onRegionChange(event.nativeEvent);
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
return <RNTMap {...this.props} onChange={this._onChange} />;
|
return <RNTMap {...this.props} onChange={this._onChange} />;
|
||||||
|
@ -322,9 +323,31 @@ MapView.propTypes = {
|
||||||
/**
|
/**
|
||||||
* Callback that is called continuously when the user is dragging the map.
|
* Callback that is called continuously when the user is dragging the map.
|
||||||
*/
|
*/
|
||||||
onRegionChange: React.PropTypes.func,
|
onChange: React.PropTypes.func,
|
||||||
...
|
...
|
||||||
};
|
};
|
||||||
|
|
||||||
|
class MapViewExample extends React.Component {
|
||||||
|
onRegionChange(event: Event) {
|
||||||
|
// Do stuff with event.region.latitude, etc.
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
var region = {
|
||||||
|
latitude: 37.48,
|
||||||
|
longitude: -122.16,
|
||||||
|
latitudeDelta: 0.1,
|
||||||
|
longitudeDelta: 0.1,
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<MapView region={region} pitchEnabled={false} style={{flex: 1}} onChange={this.onRegionChange}/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Module name
|
||||||
|
AppRegistry.registerComponent('MapViewExample', () => MapViewExample);
|
||||||
```
|
```
|
||||||
|
|
||||||
## Styles
|
## Styles
|
||||||
|
|
Loading…
Reference in New Issue