Merge pull request #5108 from iChengbo/fixRN-previewImage

fix(RN): 修复 previewImage 加载中的 loading 提示
NervJS · Dec 23, 2019 · a2f11e0 · a2f11e0
2 parents 827eea3 + 5112d2b
commit a2f11e0
Showing 1 changed file with 16 additions and 2 deletions.
diff --git a/packages/taro-rn/src/api/image/previewImage.tsx b/packages/taro-rn/src/api/image/previewImage.tsx
@@ -1,8 +1,16 @@
 import React from 'react'
-import { Modal ,Text} from 'react-native'
+import { Modal, View, ActivityIndicator, StyleSheet } from 'react-native'
 import RootSiblings from 'react-native-root-siblings'
 import ImageViewer from 'react-native-image-zoom-viewer'
 
+const styles = StyleSheet.create({
+  loadingWrapper: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+})
+
 function previewImage (obj) {
   let {
     current,
@@ -28,7 +36,13 @@ function previewImage (obj) {
           onClick={onSuccess}
           onSwipeDown={onSuccess}
           enableSwipeDown
-          loadingRender={() => <Text>loading...</Text>}
+          loadingRender={() => {
+            return (
+              <View style={[styles.loadingWrapper]}>
+                <ActivityIndicator size="large" color={'#999'} />
+              </View>
+            )
+          }}
         />
       </Modal>
     )