反应本机链接到另一个应用程序

Question

我正在尝试从我的 React 本机应用程序 link 到另一个应用程序（例如 google 地图）。

我需要这里写的链接模块：https://facebook.github.io/react-native/docs/linking.html

我的代码包含一个简单的按钮，它应该打开导航应用程序并将一些位置作为属性传递：

<TouchableOpacity 
   onPress={ () =>{
     Linking.openURL("http://maps.google.com/maps=daddr=Wien")
     .catch(err => console.error('An error occurred', err)); }}
>
   <Text>Navigate</Text>
</TouchableOpacity>

加载视图后，我没有收到任何错误，这表明要求模块工作正常。

点击按钮后，我收到以下错误消息：

undefined is not an object (evaluating '_reactNative.Linking.openURL')

我已按照以下步骤操作：https://facebook.github.io/react-native/docs/linking-libraries-ios.html 并安装了 npm install link --save <- 也许问题在于这是错误的模块？？如果打错了有谁知道正确的叫法吗？

Answer 1

您不需要 npm install link --save 或使用“Linking Libraries in iOS”指南。 “<Linking /> 组件”和 "Linking librairies action" 是两个截然不同的东西。

<Linking /> 是一个允许您打开 links（网址，或 links 到其他应用程序）和检测何时从 link（从浏览器或其他应用程序，或例如推送通知）调用您的应用程序。它是 React Native 的核心组件，并带有 react-native npm 包。

Linking librairies 在安装第三方库时是必需的（例如 react-native-maps）并且您需要将依赖项添加到 iOS Xcode 和 Android Gradle 构建配置。通常使用 react-native link <package> 命令完成，在 npm install 之后。

您必须做的唯一一件事就是在使用前在 javascript 文件中要求或导入 <Linking />。您甚至不需要文档中有关 Handling deep links 的整个部分。这仅适用于打开您的应用程序的传入 link。您需要的一切从 Opening external links

开始

现在，您的代码失败的原因是个谜。这是一个具有完全相同行为的工作应用程序的 link。一个简洁的例子是：

import React from 'react';
import { TouchableOpacity, Linking, Text } from 'react-native';

export default function Button() {
  return (
    <TouchableOpacity onPress={() => Linking.openURL('https://maps.google.com?q=stack+overflow+offices')}>
      <Text>Press me</Text>
    </TouchableOpacity>
  );
}

您也可以在 rnplay 上进行测试。

我建议清理您的项目，删除 node_modules 文件夹并再次执行 npm install，然后编译您的新项目。

反应本机链接到另一个应用程序

React native Linking to another app

ios

applinks

react-native