【问题标题】:React-Native-Maps Error (Super expression must either be null or a function)React-Native-Maps 错误(超级表达式必须为 null 或函数)
【发布时间】:2018-12-26 15:54:35
【问题描述】:

谁能帮我解决这个错误?

我从有关 React-Native-Maps 的 YouTube 教程中学习并复制代码以显示当前位置。链接:https://www.youtube.com/watch?v=MqLC0kOqrwk

错误是:超级表达式必须为空或函数

我正在使用最新版本的 React-Native-Maps React-Native-Maps 版本:“^0.22.1”,

这是我的代码。

      import React from 'react';
      import {
        AppRegistry,
        Component,
        StyleSheet,
        View,
        Text,
        screen,
        Dimensions,
        TouchableOpacity,
        Platform,
      } from 'react-native';

      import MapView from 'react-native-maps';
      import Strings from '../utils/Strings';

      var styles = require('../../assets/files/Styles');
      const {height, width} = Dimensions.get('window');
     const SCREEN_HEIGHT = height
     const SCREEN_WIDTH = width
     const ASPECT_RATIO = width / height

    const LATITUDE_DELTA = 0.00922;
    const LONGITUDE_DELTA = LATITUDE_DELTA * ASPECT_RATIO;

      export default class Track extends Component {
        static navigationOptions = {
            title: `${Strings.ST6}`,
          };

        constructor(props) {
            super(props)

          this.state = {
              initialPosition: {
                  latitude: 0,
                  longitude: 0,
                  latitudeDelta: 0,
                  longitudeDelta: 0
              },
              markerPosition: {
                    latitude: 0,
                    longitude: 0
              }
            }
        }

        watchID = null

        componentDidMount(){
            navigator.geolocation.getCurrentPosition((position) => {
                var lat = parseFloat(position.coords.latitude)
                var long = parseFloat(position.coords.longitude)

                var initialRegion = {
                    latitude: lat,
                    longitude: long,
                    latitudeDelta: LATITUDE_DELTA,
                    longitudeDelta: LONGTITUDE_DELTA
                }

                this.getState({initialPosition: initialRegion})
                this.getState({markerPosition: initialRegion})
            },
            (error) => alert(JSON.stringify(error)),
            {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000})

            this.watchID = navigator.geolocation.watchPosition((position) => {
                var lat = parseFloat(position.coords.latitude)
                var long = parseFloat(position,coords,longitude)

                var lastRegion = {
                    latitude: lat,
                    longitude: long,
                    longitudeDelta: LONGTITUDE_DELTA,
                    latitudeDelta: LATITUDE_DELTA
                }

                this.setState({initialPosition: lastRegion})
                this.setState({markerPosition: lastRegion})
            }) 
        }

        componentWillUnmount() {
            navigator.geolocation.clearWatch(this.watchID)
        }

        render() {
            return(
                <View style={style.container}>
                <MapView
                style={styles.map}
                region={this.state.initialPosition}>

                <MapView.Marker>
                    coordinate={this.state.markerPosition}
                    <View Style={styles.radius}>
                        <View Style={styles.marker}>
                        </View>
                    </View>
                </MapView.Marker>
                </MapView>
                </View>
            );
        }
    }

我猜错误是在某个地方

    constructor(props) {
        super(props)

但是我在这里没有看到错误,super应该没问题,即使我删除(道具)结果也是一样的。

【问题讨论】:

  • 该代码在语法上是有效的。我无法重现错误。
  • @JaredSmith :( 谢谢贾里德
  • 我唯一能想到的是,有些东西正在覆盖 Component 的定义,而您试图用无效的类定义扩展某些东西。

标签: react-native super react-native-maps


【解决方案1】:

在您的代码 class Track extends Component 上,您忘记调用 react 属性。请将您的代码更改为class Track extends React.Component

因为你只是调用了 Component,而 react 并不知道 'Component' 是从哪里来的

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-09-23
    • 2021-10-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-10-07
    相关资源
    最近更新 更多