Merge pull request #129 from bavuongco10/pure-item-flat-list

Using pure component to render pdf pages
wonday · Feb 10, 2018 · 03cabdf · 03cabdf
2 parents 7e38426 + 25f4da2
commit 03cabdf
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 8 deletions.
diff --git a/PdfPageView.js b/PdfPageView.js
@@ -6,25 +6,41 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+
 'use strict';
-import React, {Component} from 'react';
+import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {
     ViewPropTypes,
     requireNativeComponent,
 } from 'react-native';
+import {style} from "./index";
 
-export default class PdfPageView extends Component {
+export default class PdfPageView extends PureComponent {
 
     constructor(props) {
         super(props);
         this.state = {}
     }
 
-    render() {
+    _getStylePropsProps = () => {
+        const { width, height } = this.props;
+        if( width || height ) {
+            return { width, height };
+        }
+        return {};
+    };
 
+    render() {
+        const {
+            style,
+            ...restProps
+        } = this.props;
         return (
-            <PdfPageViewCustom {...this.props} />
+            <PdfPageViewCustom
+              {...restProps}
+              style={[style, this._getStylePropsProps()]}
+            />
         );
 
     }
@@ -33,7 +49,13 @@ export default class PdfPageView extends Component {
 PdfPageView.propTypes = {
     ...ViewPropTypes,
     fileNo: PropTypes.number,
-    page: PropTypes.number
+    page: PropTypes.number,
+    width: PropTypes.number,
+    height: PropTypes.number
+};
+
+PdfPageView.defaultProps = {
+    style: {}
 };
 
-let PdfPageViewCustom = requireNativeComponent('RCTPdfPageView', PdfPageView, {nativeOnly: {}});
+let PdfPageViewCustom = requireNativeComponent('RCTPdfPageView', PdfPageView, {nativeOnly: {}});
diff --git a/PdfView.js b/PdfView.js
@@ -220,7 +220,8 @@ export default class PdfView extends Component {
                     key={item.id}
                     fileNo={this.state.fileNo}
                     page={item.key + 1}
-                    style={{width: this._getPageWidth(), height: this._getPageHeight()}}
+                    width={this._getPageWidth()}
+                    height={this._getPageHeight()}
                 />
                 {(index !== this.state.numberOfPages - 1) && this._renderSeparator()}
             </DoubleTapView>
@@ -316,4 +317,4 @@ export default class PdfView extends Component {
 
     }
 
-}
+}