fix: showToast API 参数 icon 为 none 时仍显示图片

NervJS · May 21, 2019 · 7638047 · 7638047
1 parent 7e1129d
commit 7638047
Showing 1 changed file with 41 additions and 14 deletions.
diff --git a/packages/taro-rn/src/api/interface/toast.js b/packages/taro-rn/src/api/interface/toast.js
@@ -1,8 +1,7 @@
 import React from 'react'
 import { View, Text, Image, StyleSheet, ActivityIndicator } from 'react-native'
-import Toast from 'react-native-root-toast'
 import RootSiblings from 'react-native-root-siblings'
-import success from './success.png'
+import successPng from './success.png'
 import { errorHandler, shouleBeObject, successHandler } from '../utils'
 
 const styles = StyleSheet.create({
@@ -20,6 +19,15 @@ const styles = StyleSheet.create({
     color: '#FFFFFF',
     textAlign: 'center'
   },
+  textToastContent: {
+    paddingTop: 10,
+    paddingBottom: 10,
+    paddingLeft: 15,
+    paddingRight: 15,
+    lineHeight: 20,
+    color: '#FFFFFF',
+    textAlign: 'center'
+  },
   container: {
     zIndex: 10000,
     position: 'absolute',
@@ -44,6 +52,14 @@ const styles = StyleSheet.create({
     backgroundColor: 'rgba(20,20,20,0.8)',
     borderRadius: 8,
     flexDirection: 'column'
+  },
+  textGrayBlock: {
+    width: 180,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: 'rgba(20,20,20,0.8)',
+    borderRadius: 8,
+    flexDirection: 'column'
   }
 })
 
@@ -79,10 +95,6 @@ class WXLoading extends React.Component {
   }
 }
 
-const iconList = ['success', 'loading', 'none']
-const sourceMap = {success, none: ''}
-let wx
-
 function showToast (options) {
   const isObject = shouleBeObject(options)
   if (!isObject.res) {
@@ -93,21 +105,36 @@ function showToast (options) {
 
   const res = {errMsg: 'showToast:ok'}
   let {title = '', icon = 'success', image, duration = 1500, mask, success, fail, complete} = options || {} // eslint-disable-line
-  let source
+
+  let ToastView
+
   if (image) {
-    source = image
-  } else if (iconList.indexOf(icon) > -1) {
-    source = sourceMap[icon]
-  }
-  const ToastView = !image && icon === 'loading' ? <WXLoading />
-    : <View style={styles.container}>
+    ToastView = <View style={styles.container}>
       <View style={styles.grayBlock}>
         <View style={styles.toastView}>
-          <Image source={source} style={styles.toastIcon} />
+          <Image source={image} style={styles.toastIcon} />
           <Text style={styles.toastContent}>{title || ''}</Text>
         </View>
       </View>
     </View>
+  } else if (icon === 'loading') {
+    ToastView = <WXLoading />
+  } else if (icon === 'none') {
+    ToastView = <View style={styles.container}>
+      <View style={styles.textGrayBlock}>
+        <Text style={styles.textToastContent}>{title || ''}</Text>
+      </View>
+    </View>
+  } else {
+    ToastView = <View style={styles.container}>
+      <View style={styles.grayBlock}>
+        <View style={styles.toastView}>
+          <Image source={successPng} style={styles.toastIcon} />
+          <Text style={styles.toastContent}>{title || ''}</Text>
+        </View>
+      </View>
+    </View>
+  }
 
   try {
     // setTimeout fires incorrectly when using chrome debug #4470