Fixed ImageBackground could't be wrapped by Touchable* component

Summary:
In 0.46, as warning's advice, I use `ImageBackground` to replace `Image`s which used as background image wrapper, and in some cases, I also wrap `ImageBackground` with `TouchableHighlight` to make it clickable.

But here comes an error:

> Touchable child must either be native or forward setNativeProps to a native component

![2017-07-07 3 25 19](https://user-images.githubusercontent.com/3055294/27948869-f7c5832c-632d-11e7-97ba-5074cca82961.png)

So I pick some code from `Image.ios.js` into `ImageBackground.js` to solve it.

Please help to review, thanks!
Closes https://github.com/facebook/react-native/pull/14884

Reviewed By: shergin

Differential Revision: D5380988

Pulled By: javache

fbshipit-source-id: 35fda029030a39e720b6266f5d0a27ea3ff145ef
This commit is contained in:
Patrick 2017-07-10 04:46:18 -07:00 committed by Facebook Github Bot
parent e6941990ef
commit dc97e3fb4e
1 changed files with 20 additions and 1 deletions

View File

@ -17,6 +17,10 @@ const React = require('React');
const StyleSheet = require('StyleSheet');
const View = require('View');
const ensureComponentIsNative = require('ensureComponentIsNative');
import type {NativeMethodsMixinType} from 'ReactNativeTypes';
/**
* Very simple drop-in replacement for <Image> which supports nesting views.
*
@ -42,11 +46,26 @@ const View = require('View');
* ```
*/
class ImageBackground extends React.Component {
setNativeProps(props: Object) {
// Work-around flow
const viewRef = this._viewRef;
if (viewRef) {
ensureComponentIsNative(viewRef);
viewRef.setNativeProps(props);
}
}
_viewRef: ?NativeMethodsMixinType = null;
_captureRef = ref => {
this._viewRef = ref;
};
render() {
const {children, style, imageStyle, imageRef, ...props} = this.props;
return (
<View style={style}>
<View style={style} ref={this._captureRef}>
<Image
{...props}
style={[