Question

我收到以下错误：TS1219 Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

我知道我可以通过在"experimentalDecorators": true中设置tsconfig.json来抑制此问题。

但我仍然想知道为什么我从这段代码中得到错误：

import * as React from "react";

import scriptLoader from 'react-async-script-loader'

@scriptLoader(['https://maps.googleapis.com/maps/api/js?key=your-key'])
export default class Maps extends React.Component<any, any> {
    constructor(props: any) {
        super(props);
        this.map = null;
    }

    refs: {
        [string: string]: any;
        map: any;
    }
    map: any;

    componentWillReceiveProps({ isScriptLoaded, isScriptLoadSucceed }) {
        if (isScriptLoaded && !this.props.isScriptLoaded) { // load finished
            if (isScriptLoadSucceed) {
                this.map = new google.maps.Map(this.refs.map, {
                    center: { lat: 10.794234, lng: 106.706541 },
                    zoom: 20
                });

                if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition((position) => {
                        const pos = {
                            lat: position.coords.latitude,
                            lng: position.coords.longitude
                        };

                        this.map.setCenter(pos);

                        const marker = new google.maps.Marker({
                            position: pos,
                            map: this.map,
                            title: 'Hello World!'
                        });
                    }, () => {
                        console.log('navigator disabled');
                    });
                } else {
                    // Browser doesn't support Geolocation
                    console.log('navigator disabled');
                }
            }
            else this.props.onError()
        }
    }

    render() {
        return (
            <div>
                <div ref="map" style={{ height: '80%', width: '100%' }}></div>
                {!this.map && <div className="center-md">Loading...</div>}
            </div>
        )
    }
}

Answer 1

但我仍然想知道为什么我从这段代码中得到错误：

因为您在@scriptLoader(['https://maps.googleapis.com/maps/api/js?key=your-key'])使用装饰器。

TypeScript Visual Studio TS1219对装饰器的实验性支持是一项在将来的版本中可能会发生变化的功能。

1 个答案: