feat: Use forwardRef to allow access to ref.measure and others. (#419)
This uses forwardRef to allow access to the View that wraps the native FastImage component. closes #69
This commit is contained in:
parent
58add0ed3c
commit
2b4fba3ad8
32
src/index.js
32
src/index.js
|
@ -1,4 +1,4 @@
|
|||
import React, { Component } from 'react'
|
||||
import React, { forwardRef } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import {
|
||||
View,
|
||||
|
@ -11,15 +11,9 @@ import {
|
|||
|
||||
const FastImageViewNativeModule = NativeModules.FastImageView
|
||||
|
||||
class FastImage extends Component {
|
||||
setNativeProps(nativeProps) {
|
||||
this._root.setNativeProps(nativeProps)
|
||||
}
|
||||
|
||||
captureRef = e => (this._root = e)
|
||||
|
||||
render() {
|
||||
const {
|
||||
const FastImage = forwardRef(
|
||||
(
|
||||
{
|
||||
source,
|
||||
onLoadStart,
|
||||
onProgress,
|
||||
|
@ -30,16 +24,14 @@ class FastImage extends Component {
|
|||
children,
|
||||
fallback,
|
||||
...props
|
||||
} = this.props
|
||||
|
||||
},
|
||||
ref,
|
||||
) => {
|
||||
const resolvedSource = Image.resolveAssetSource(source)
|
||||
|
||||
if (fallback) {
|
||||
return (
|
||||
<View
|
||||
style={[styles.imageContainer, style]}
|
||||
ref={this.captureRef}
|
||||
>
|
||||
<View style={[styles.imageContainer, style]} ref={ref}>
|
||||
<Image
|
||||
{...props}
|
||||
style={StyleSheet.absoluteFill}
|
||||
|
@ -56,7 +48,7 @@ class FastImage extends Component {
|
|||
}
|
||||
|
||||
return (
|
||||
<View style={[styles.imageContainer, style]} ref={this.captureRef}>
|
||||
<View style={[styles.imageContainer, style]} ref={ref}>
|
||||
<FastImageView
|
||||
{...props}
|
||||
style={StyleSheet.absoluteFill}
|
||||
|
@ -70,8 +62,10 @@ class FastImage extends Component {
|
|||
{children}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
)
|
||||
|
||||
FastImage.displayName = 'FastImage'
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
imageContainer: {
|
||||
|
|
Loading…
Reference in New Issue