Как использовать ответ-родной-веб-просмотр-листовка? - PullRequest
0 голосов
/ 15 января 2020

Я разрабатываю приложение, используя React Native и Expo . И я хочу интегрировать response-native-webview-leaflet . Но когда я хочу использовать тег WebViewLeaflet, чтобы иметь возможность использовать WMS с GeoServer , он подчеркивает тег, а затем показывает эту ошибку при наведении курсора.

Тип элемента JSX 'WebViewLeaflet' не имеет никакой конструкции или вызова signatures.ts (2604)

Проблема Peek Нет быстрых исправлений.

И когда я пытаюсь запустить, я получаю эти ошибки

Иногда это

Uncaught Invariant Violation: недопустимый тип элемента: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получил: undefined. Скорее всего, вы забыли экспортировать свой компонент из файла, который он определил. Фактически, я выполнил шаг установки, но у меня ничего не получилось.

и в другой раз

WebView удален из React Native. Теперь его можно установить и импортировать из «act-native-webview »вместо« Reaction-native ». См. https://github.com/react-native-community/react-native-webview

Вот мой код

import React, {Component} from 'react';
import WebViewLeaflet from 'react-native-webview-leaflet';
import { View } from 'react-native';

 export default class Map extends Component{
    render(){
      return (
        <View>
            <WebViewLeaflet/>
        </View>
      )
    }
}

Пакет. json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.6",
    "expo": "~36.0.0",
    "expo-asset": "^8.0.0",
    "expo-file-system": "^8.0.0",
    "expo-font": "^8.0.0",
    "leaflet": "^1.3.4",
    "react": "~16.9.0",
    "react-dom": "~16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
    "react-native-dynamic-vector-icons": "^0.2.1",
    "react-native-gesture-handler": "^1.5.3",
    "react-native-maps": "^0.26.1",
    "react-native-paper": "^2.2.2",
    "react-native-reanimated": "^1.5.0",
    "react-native-safe-area-context": "^0.6.2",
    "react-native-screens": "^2.0.0-alpha.12",
    "react-native-vector-icons": "^6.6.0",
    "react-native-web": "~0.11.7",
    "react-native-webview-leaflet": "^4.3.4",
    "react-navigation": "^4.0.10",
    "react-navigation-drawer": "^2.3.3",
    "react-navigation-material-bottom-tabs": "^2.1.5",
    "react-navigation-stack": "^2.0.15",
    "react-navigation-tabs": "^2.7.0"
  },
  "devDependencies": {
    "@types/react": "~16.9.0",
    "@types/react-native": "~0.60.23",
    "@babel/core": "^7.0.0",
    "babel-preset-expo": "~8.0.0",
    "typescript": "~3.6.3"
  },
  "private": true
}

1 Ответ

0 голосов
/ 13 февраля 2020
import {
  WebViewLeaflet, WebViewLeafletEvents, MapShapeType, Marker, Popup,
  AnimationType, INFINITE_ANIMATION_ITERATIONS
} from 'react-native-webview-leaflet';

попробуйте импортировать ответную нативную веб-брошюру, как указано выше

...