Leaflet 上的类型“IntrinsicAttributes & MapContainerProps”上不存在属性“center”

时间:2021-03-31 15:33:55

标签: typescript leaflet react-typescript

我正在尝试在我的应用程序上实现一个简单的地图,但在使用下面来自 React Leaflet 的示例代码时出现此错误。

import React from "react";
import { MapContainer, TileLayer, Marker, Popup } from "react-leaflet";

export default function App() {
  return (
    <MapContainer center={[51.505, -0.09]} zoom={13} scrollWheelZoom={false}>
        <TileLayer
            attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
            url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
        />
        <Marker position={[51.505, -0.09]}>
            <Popup>
            A pretty CSS3 popup. <br /> Easily customizable.
            </Popup>
        </Marker>
    </MapContainer>
  );
}

错误:

Type '{ children: Element[]; center: number[]; zoom: number; scrollWheelZoom: boolean; }' is not assignable to type 'IntrinsicAttributes & MapContainerProps'.
  Property 'center' does not exist on type 'IntrinsicAttributes & MapContainerProps'.  TS2322

    150 |                     />
    151 | 
  > 152 | <MapContainer center={[51.505, -0.09]} zoom={13} scrollWheelZoom={false}>
        |               ^
    153 |   <TileLayer
    154 |     attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
    155 |     url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"

我正在使用 React 和 Typescript。

0 个答案:

没有答案