【问题标题】：Linking Map in React Native在 React Native 中链接地图
【发布时间】：2016-03-13 06:10:23
【问题描述】：

我在 iOS 上使用 RN 0.20。我想创建一个链接，如果您单击该链接，它会将您重定向到手机中可用的地图应用程序及其坐标。这就是我使用 Linking 组件所做的。

redirectToMap() {
    Linking.canOpenURL('geo:37.484847,-122.148386').then(supported => {
        if (supported) {
            Linking.openURL('geo:37.484847,-122.148386');
        } else {
            console.log('Don\'t know how to go');
        }
    }).catch(err => console.error('An error occurred', err));
}

但它一直让我“不知道该怎么走”。但是，我从https://facebook.github.io/react-native/docs/linking.html 中的文档中看到，使用geo: 链接到地图是可行的。

【问题讨论】：

标签： ios reactjs react-native

【解决方案1】：

使用正确的 URL 方案

看看iOS的official documentation。要打开地图，请使用建议的方案：

http://maps.apple.com/?ll=<lat>,<long>

【讨论】：

非常感谢您的帮助:)
好的，但是为什么链接geo URL 不起作用？正如@KelvinAliyanto 提到的，它清楚地写在 React Native 文档中。我预计，当我使用geo URL 时会弹出一个菜单（如果有超过 1 个地图应用程序），如下所示：kevinandamanda.com/whatsnew/wp-content/uploads/2014/01/…
点击iOS官方文档链接。它说：“与某些方案不同，地图 URL 不以“地图”方案标识符开头。相反，地图链接被指定为常规 http 链接，并在 Safari 或目标平台上的地图应用程序中打开。”
如果要开始导航，请使用http://maps.apple.com/?daddr=<lat>,<long>。

【解决方案2】：

你可以使用 react-native-open-maps 包

安装存储库 $ npm install --save react-native-open-maps
将导入添加到文件顶部 import openMap from 'react-native-open-maps'
放在一起

import React, { Component } from 'react'
import { Button } from 'react-native'
import openMap from 'react-native-open-maps'

export default class App extends Component {
  _goToYosemite() {
    openMap({ latitude: 37.865101, longitude: -119.538330 });
  }

render() {
    return (
      <Button
        color={'#bdc3c7'}
        onPress={this._goToYosemite}
        title="Click To Open Maps ?" />
    );
  }
}

【讨论】：