Merge branch 'master' of github.com:NervJS/taro

NervJS · Nov 20, 2018 · 5665d7f · 5665d7f
2 parents c730c2b + c312fc7
commit 5665d7f
Show file tree

Hide file tree

Showing 14 changed files with 541 additions and 47 deletions.
diff --git a/packages/taro-cli/src/convertor.js b/packages/taro-cli/src/convertor.js
@@ -57,7 +57,7 @@ function analyzeImportUrl (sourceFilePath, scriptFiles, source, value) {
             if (fs.existsSync(path.join(vpath, 'index.js'))) {
               vpath = path.join(vpath, 'index.js')
             } else {
-              printLog(Util.pocessTypeEnum.ERROR, '引用目录', `文件 ${sourceFilePath} 中引用了目录 ${value}！`)
+              printLog(pocessTypeEnum.ERROR, '引用目录', `文件 ${sourceFilePath} 中引用了目录 ${value}！`)
               return
             }
           }

diff --git a/packages/taro-cli/templates/default/config/index b/packages/taro-cli/templates/default/config/index
@@ -16,8 +16,8 @@ const config = {
         'env'
       ],
       plugins: [
-        'transform-class-properties',
         'transform-decorators-legacy',
+        'transform-class-properties',
         'transform-object-rest-spread'
       ]
     }

diff --git a/packages/taro-cli/templates/mobx/config/index b/packages/taro-cli/templates/mobx/config/index
@@ -16,8 +16,8 @@ const config = {
         'env'
       ],
       plugins: [
-        'transform-class-properties',
         'transform-decorators-legacy',
+        'transform-class-properties',
         'transform-object-rest-spread'
       ]
     }
@@ -38,7 +38,9 @@ const config = {
         },
         url: {
           enable: true,
-          limit: 10240
+          config: {
+            limit: 10240 // 设定转换尺寸上限
+          }
         }
       }
     }

diff --git a/packages/taro-cli/templates/redux/config/index b/packages/taro-cli/templates/redux/config/index
@@ -16,8 +16,8 @@ const config = {
         'env'
       ],
       plugins: [
-        'transform-class-properties',
         'transform-decorators-legacy',
+        'transform-class-properties',
         'transform-object-rest-spread'
       ]
     }

diff --git a/packages/taro-components-rn/App.js b/packages/taro-components-rn/App.js
@@ -23,6 +23,7 @@ import EXPicker from './example/EXPicker'
 import EXForm from './example/EXForm'
 import EXAudio from './example/EXAudio'
 import EXVideo from './example/EXVideo'
+import EXMap from './example/EXMap'
 
 export default class App extends Component {
   state = {
@@ -91,6 +92,10 @@ export default class App extends Component {
       >
         <Text>Welcome to React Native!</Text>
 
+        <EXMap />
+
+        <EXImage />
+
         <EXVideo />
 
         <Text numberOfLines={1}>Welcome to React Native!Welcome to React Native!Welcome to React Native!Welcome to React Native!</Text>
@@ -154,7 +159,7 @@ export default class App extends Component {
         <EXSwitch />
 
         <Text>Image</Text>
-        <EXImage />
+        {/* <EXImage /> */}
 
         <Text>Checkbox（Single & Group）</Text>
         <EXCheckbox />

diff --git a/packages/taro-components-rn/app.json b/packages/taro-components-rn/app.json
@@ -4,5 +4,17 @@
     "slug": "TCRExample"
   },
   "name": "TCRExample",
-  "displayName": "TCRExample"
+  "displayName": "TCRExample",
+  "ios": {
+    "config": {
+      "googleMapsApiKey": ""
+    }
+  },
+  "android": {
+    "config": {
+      "googleMaps": {
+        "apiKey": ""
+      }
+    }
+  }
 }
diff --git a/packages/taro-components-rn/example/EXImage.js b/packages/taro-components-rn/example/EXImage.js
@@ -18,19 +18,19 @@ export default class EXImage extends Component {
     }
   }
 
-  componentDidMount () {
-    setTimeout(() => {
-      this.setState({
-        src: 'https://storage.360buyimg.com/mtd/home/jdlogo1529462435227.png'
-      })
-    }, 0)
-  }
+  // componentDidMount () {
+  //   setTimeout(() => {
+  //     this.setState({
+  //       src: 'https://storage.360buyimg.com/mtd/home/jdlogo1529462435227.png'
+  //     })
+  //   }, 0)
+  // }
 
   render () {
     return (
       <View style={{ width: 100 }}>
         <Image
-          src={this.state.src}
+          src={'https://storage.360buyimg.com/mtd/home/jdlogo1529462435227.png'}
           // src={require('./jdlogo.png')}
           mode="widthFix"
           style={{

diff --git a/packages/taro-components-rn/example/EXMap.js b/packages/taro-components-rn/example/EXMap.js
@@ -0,0 +1,71 @@
+import React, { Component } from 'react'
+import { View } from '../src'
+import Map from '../dist/components/Map'
+
+export default class EXAudio extends Component {
+  state = {
+    markers: [],
+    polyline: [
+      {
+        points: [
+          { latitude: 37.78815, longitude: -122.4314 },
+          { latitude: 37.77805, longitude: -122.4204 },
+          { latitude: 37.76795, longitude: -122.4194 }
+        ],
+        color: 'red',
+        width: 1
+      }
+    ],
+    polygons: [
+      {
+        points: [
+          { latitude: 37.75815, longitude: -122.4014 },
+          { latitude: 37.74805, longitude: -122.3904 },
+          { latitude: 37.73795, longitude: -122.3894 },
+        ],
+        strokeColor: 'green',
+        strokeWidth: 2,
+        fillColor: 'orange'
+      }
+    ],
+    circles: [
+      {
+        latitude: 37.71795,
+        longitude: -122.3694,
+        color: 'pink',
+        fillColor: 'yellow',
+        radius: 1200,
+        strokeWidth: 2
+      }
+    ]
+  }
+
+  render () {
+    return (
+      <View style={{ marginVertical: 10, width: '80%', height: 300 }}>
+        <Map
+          latitude={37.78825}
+          longitude={-122.4324}
+          markers={this.state.markers}
+          polyline={this.state.polyline}
+          polygons={this.state.polygons}
+          circles={this.state.circles}
+          showCompass={true}
+          onClick={(coordinate) => {
+            console.log(coordinate)
+            this.setState({
+              markers: [
+                {
+                  id: 0,
+                  ...coordinate,
+                  callout: { content: '我我我我', color: 'red' },
+                  anchor: { x: 1, y: 1 }
+                }
+              ]
+            })
+          }}
+        />
+      </View>
+    )
+  }
+}
diff --git a/packages/taro-components-rn/src/components/Audio/index.tsx b/packages/taro-components-rn/src/components/Audio/index.tsx
@@ -201,7 +201,6 @@ class _Audio extends React.Component<Props, State> {
     try {
       await soundObject.loadAsync(this.getSource(), {
         isLooping: !!this.props.loop,
-        rate: 5
       })
     } catch (err) {
       // ERR
@@ -247,7 +246,7 @@ class _Audio extends React.Component<Props, State> {
               <View style={styles.name}><Text style={styles.nameText}>{this.props.name}</Text></View>
               <View style={styles.author}><Text style={styles.authorText}>{this.props.author}</Text></View>
             </View>
-            <View style={styles.time}><Text style={styles.timeText}>{this._getMMSSFromMillis(this.state.playbackInstancePosition)}-{playbackState}</Text></View>
+            <View style={styles.time}><Text style={styles.timeText}>{this._getMMSSFromMillis(this.state.playbackInstancePosition)}</Text></View>
           </View>
         </View>
         <View style={styles.progressBar}>

diff --git a/packages/taro-components-rn/src/components/Image/index.js b/packages/taro-components-rn/src/components/Image/index.js
@@ -40,9 +40,8 @@ type Props = {
 }
 
 type State = {
-  // height:width
   ratio: number,
-  layoutWidth: number
+  imageHeight: number
 }
 
 class _Image extends React.Component<Props, State> {
@@ -66,30 +65,39 @@ class _Image extends React.Component<Props, State> {
 
   onLoad = (event: Object) => {
     const { src, onLoad } = this.props
-    // const { width, height } = Image.resolveAssetSource(typeof src === 'string' && /^(https?:)?\/\//.test(src) ? { uri: src } : src)
     const { width, height } = Image.resolveAssetSource(typeof src === 'string' ? { uri: src } : src)
     onLoad && onLoad({
       detail: { width, height }
     })
   }
 
   onLayout = (event: Object) => {
+    const { mode, style } = this.props
     const { width: layoutWidth } = event.nativeEvent.layout
-    this.setState({
-      layoutWidth
-    })
+    const flattenStyle = StyleSheet.flatten(style) || {}
+    if (mode === 'widthFix' && typeof flattenStyle.width === 'string') {
+      if (this._isMounted) return
+      this.setState({
+        layoutWidth
+      })
+    }
   }
 
   loadImg = (props: Props) => {
-    const { src } = props
+    const { mode, src } = props
+    if (mode !== 'widthFix') return
     if (typeof src === 'string') {
       Image.getSize(props.src, (width, height) => {
-        this.setState({ ratio: height / width })
-      })
+        if (this._isMounted) return
+        this.setState({
+          ratio: height / width
+        })
+    })
     } else {
-      const source = Image.resolveAssetSource(props.src)
+      const { width, height } = Image.resolveAssetSource(props.src) || {}
+      if (this._isMounted) return
       this.setState({
-        ratio: source ? (source.height / source.width) : 0
+        ratio: height / width
       })
     }
   }
@@ -99,7 +107,12 @@ class _Image extends React.Component<Props, State> {
     this.loadImg(nextProps)
   }
 
+  componentWillMount () {
+    this._isMounted = true
+  }
+
   componentDidMount () {
+    this._isMounted = false
     this.loadImg(this.props)
   }
 
@@ -110,30 +123,33 @@ class _Image extends React.Component<Props, State> {
       mode,
     } = this.props
 
-    const flattenStyle = StyleSheet.flatten(style)
+    const flattenStyle = StyleSheet.flatten(style) || {}
 
     // The parameter passed to require must be a string literal
-    // src = typeof src === 'string' && /^(https?:)?\/\//.test(src) ? { uri: src } : src
     src = typeof src === 'string' ? { uri: src } : src
 
     const isWidthFix = mode === 'widthFix'
 
-    mode = resizeModeMap[mode] || (isWidthFix ? undefined : 'stretch')
+    const rMode = resizeModeMap[mode] || (isWidthFix ? undefined : 'stretch')
 
     const imageHeight = (() => {
       if (isWidthFix) {
-        let width = flattenStyle && flattenStyle.width
-        typeof width === 'string' && (width = this.state.layoutWidth)
-        return (width || 300) * this.state.ratio
+        if (typeof flattenStyle.width === 'string') {
+          return this.state.layoutWidth * this.state.ratio
+        } else if (typeof flattenStyle.width === 'number') {
+          return flattenStyle.width * this.state.ratio
+        } else {
+          return 300 * this.state.ratio
+        }
       } else {
-        return (flattenStyle && flattenStyle.height) || 225
+        return flattenStyle.height || 225
       }
     })()
 
     return (
       <Image
         source={src}
-        resizeMode={mode}
+        resizeMode={rMode}
         onError={this.onError}
         onLoad={this.onLoad}
         onLayout={this.onLayout}
@@ -143,7 +159,7 @@ class _Image extends React.Component<Props, State> {
           },
           style,
           {
-            height: imageHeight || this.state.imageHeight
+            height: imageHeight
           }
         ]}
       />