Fix an issue with unsafe picker access to setNativeProps.

Summary:
Fixing an issue where PickerIOS and DatePicker are being accessed unsafely, As a side effect we are also using ref callbacks as oppose to strings.

Fixed after spotting an issue in our app where the picker is closed and the callback attempts to update native props for an item that no longer exists.
Closes https://github.com/facebook/react-native/pull/3920

Reviewed By: svcscm

Differential Revision: D2663634

Pulled By: nicklockwood

fb-gh-sync-id: 813b32a038f59864401d5d3985c7ea32f5e13301
This commit is contained in:
Matt Revell 2015-12-04 06:56:41 -08:00 committed by facebook-github-bot-9
parent 4661e59d1a
commit c1849e7f4b
2 changed files with 6 additions and 10 deletions

View File

@ -22,8 +22,6 @@ var View = require('View');
var requireNativeComponent = require('requireNativeComponent');
var DATEPICKER = 'datepicker';
type DefaultProps = {
mode: 'date' | 'time' | 'datetime';
};
@ -108,8 +106,8 @@ var DatePickerIOS = React.createClass({
// certain values. In other words, the embedder of this component should
// be the source of truth, not the native component.
var propsTimeStamp = this.props.date.getTime();
if (nativeTimeStamp !== propsTimeStamp) {
this.refs[DATEPICKER].setNativeProps({
if (this._picker && nativeTimeStamp !== propsTimeStamp) {
this._picker.setNativeProps({
date: propsTimeStamp,
});
}
@ -120,7 +118,7 @@ var DatePickerIOS = React.createClass({
return (
<View style={props.style}>
<RCTDatePickerIOS
ref={DATEPICKER}
ref={ picker => this._picker = picker }
style={styles.datePickerIOS}
date={props.date.getTime()}
maximumDate={

View File

@ -21,8 +21,6 @@ var View = require('View');
var requireNativeComponent = require('requireNativeComponent');
var PICKER = 'picker';
var PickerIOS = React.createClass({
mixins: [NativeMethodsMixin],
@ -57,7 +55,7 @@ var PickerIOS = React.createClass({
return (
<View style={this.props.style}>
<RCTPickerIOS
ref={PICKER}
ref={ picker => this._picker = picker }
style={styles.pickerIOS}
items={this.state.items}
selectedIndex={this.state.selectedIndex}
@ -81,8 +79,8 @@ var PickerIOS = React.createClass({
// disallow/undo/mutate the selection of certain values. In other
// words, the embedder of this component should be the source of
// truth, not the native component.
if (this.state.selectedIndex !== event.nativeEvent.newIndex) {
this.refs[PICKER].setNativeProps({
if (this._picker && this.state.selectedIndex !== event.nativeEvent.newIndex) {
this._picker.setNativeProps({
selectedIndex: this.state.selectedIndex
});
}