标签: react-native-android

我无法将 android 模拟器与 react native 调试器连接起来。

当我运行时react-native run-android，它成功启动了应用程序而没有显示任何错误。它还带来了节点 Metro Bundler。但它没有在 RN 调试器中打印任何日志。当我在页面上按重新加载应用程序时，它显示以下弹出错误：

React Native：没有应用程序连接
向所有 React Native 应用程序发送“重新加载”失败。确保您的应用程序在模拟器或手机上运行

按 RN 调试器“重新加载应用程序”按钮时弹出错误

我试过运行它，adb reverse tcp:8081 tcp:8081但它不起作用。当我在模拟器中按 Cmd+m 时，它显示多点触控。所以我也无法打开开发者菜单。

按下 Cmd+m 时无意触发

System:
    OS: macOS Mojave 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
    Memory: 60.96 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.12.0 - /usr/local/bin/node
    npm: 6.12.0 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.2, DriverKit 19.0, macOS …

创建了一个列表组件，它有一个图像、一些文本和一个按钮。图像上有边框半径和边框颜色。

问题：android 上的彩色边框半径未被识别，但在 iOS 上它工作正常......

这是代码：

列表：

import React, { useState } from 'react';
import {
    View,
    Text,
    Image,
    StyleSheet,
    Modal,
    FlatList,
    Dimensions,
    TouchableOpacity,
    TouchableWithoutFeedback
} from 'react-native';
import { Svg, Path, G, Line } from 'react-native-svg';
const { width } = Dimensions.get('window');

const BlockList = (props) => {
    const onPress = (name) => {
        alert('Unblocking ' + name);
    };
    return (
        <FlatList
            style={styles.container}
            data={props.data}
            renderItem={({ item, index }) => (
                <View style={styles.itemContainer}>
                    <View style={styles.leftSide}>
                        <Image source={item.img} style={styles.img} resizeMode={'contain'} /> …

我正在开发一个 React Native 应用程序并尝试从 android 访问本机模块。我正在关注这个官方文档 在此处输入链接描述

创建本机模块后，当我尝试在 javaScript 类中访问它时，它显示错误“typeError: null is not an object (Evaluating _ToastExample.default.show)”

ToastModule.java

package com.awesomeproject;

import android.widget.Toast;

import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

import java.util.Map;
import java.util.HashMap;

public class ToastModule extends ReactContextBaseJavaModule {
  private static ReactApplicationContext reactContext;

  private static final String DURATION_SHORT_KEY = "SHORT";
  private static final String DURATION_LONG_KEY = "LONG";

  ToastModule(ReactApplicationContext context) {
    super(context);
    reactContext = context;
  }

  @Override
  public String getName() {
    return "ToastExample";
  }

  @Override
  public Map<String, Object> …

我正在使用这个https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html从任何来源访问我的导航，我的文件如下所示：

import { createRef } from 'react';

export const navigationRef = createRef();

export function navigate(name, params) {
  return navigationRef.current?.navigate(name, params);
}

export function goBack() {
  return navigationRef.current?.goBack();
}

export function getRootState() {
  return navigationRef.current?.getRootState();
}

这非常适合我的@navigation/drawer，它在我的堆栈导航之外。

只有最后一个方法不同步的一个问题，我希望在我的项目菜单上有一个活动状态，即当前路线。

反应导航5怎么可能？

我最近在 react-native 源代码中注意到以下方法：

public void receiveCommand(@NonNull T root, int commandId, @Nullable ReadableArray args)

ViewManager 类的标记为已弃用。因此，我尝试将其替换为未标记为已弃用的重载版本：

public void receiveCommand(@NonNull T root, String commandId, @Nullable ReadableArray args)

但这个永远不会被调用。我想我可能还需要更改其他一些方法，但是我找不到任何信息，还需要做什么，没有可以遵循的迁移指南。

有谁知道如何正确使用新的、未弃用的 receiveCommand 方法？

ViewManager 的源代码可以在这里找到：https : //github.com/facebook/react-native/blob/master/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewManager.java

我想onRequestPermissionsResult在原生 Android 模块中使用，该模块可以导入到 React Native 项目中。

权限处理需要在模块中进行 - 因此PermissionsAndroid或更改项目 MainActivity 将不起作用。对于类似的，onActivityResult有一种方法可以为 ReactApplicationContext创建和添加侦听器。

有没有办法做到这一点onRequestPermissionsResult？

编辑：添加了本机模块代码以显示我正在尝试执行的操作：

public class NativeModule extends ReactContextBaseJavaModule {
    public NativeModule(ReactApplicationContext reactContext) {
        super(reactContext);
        ...
    }

    @ReactMethod
    public void requestPermissions() {
        getCurrentActivity().requestPermissions(...)
    }

    // is it possible to hook into the requestPermissions callback with the result from within the module? 
    // public boolean onRequestPermissionsResult(int requestCode, String[] permissions, int[] grantResults) { }

    ...
}

我正在尝试将图像从存储上传到一个安静的 API，但我在 Android 上不断收到网络请求失败（这意味着请求甚至没有通过），还没有在 iOS 上检查，因为我不需要那部分然而。API 已经在运行，并且已经用 Postman 进行了测试。

React Native 代码是：

  body.append('vehicles',{ 
    resource_id: 2,
    resource: 'vehicles',
    cat_file_id: fileId,
    active: 1,
    vehicles: photo, //<- photo value below
    name: 'vehicles',
    type: 'image/jpeg'
  })

  fetch(`${BASE_URL}/files`, {
    method: 'POST',
    headers: {
      'Content-Type': 'multipart/form-data',
      Accept: "*/*",
      Authorization: 'Bearer '+auth
    },
    body: body

  }).then(response => response.json())
  .then(response => {
    console.log('IMAGE RESPONSE', response)
  })
  .catch(error => console.log('ERROR', error))

照片值看起来像 file:///storage/emulated/0/DCIM/...

响应：

ERROR TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (fetch.umd.js:473)
at XMLHttpRequest.dispatchEvent (event-target-shim.js:818)
at XMLHttpRequest.setReadyState (XMLHttpRequest.js:574)
at …

我有一个带有两个视图的应用程序，只有当应用程序处于活动状态（前台）时才必须显示蓝色视图，而当应用程序置于后台时（例如在 Android 上的硬件方形按钮上计时），必须显示绿色视图。

下图显示了当我将应用程序置于后台状态时当前得到的结果：

以下是当 App 置于后台时我想做的事情（在 iOS 上工作，在 Android 上不太好）：

这就是实现。

请暂时忽略 iOS 的组件与 Android 的组件几乎相同，除了 View 的样式。我正在用不同的组件进行其他测试，目前我可以让它们保持这样。两个组件（iOS / Android）的区别在于样式，因为在iOS中是zIndex有效的，而在Android中我必须使用elevation重叠视图。

const showSecurityScreenFromAppState = appState =>
    ['background', 'inactive'].includes(appState);

const withSecurityScreenIOS = Wrapped => {
    return class WithSecurityScreen extends React.Component {
        constructor(props) {
            super(props);
        }

        state = {
            showSecurityScreen: showSecurityScreenFromAppState(AppState.currentState),
        };

        componentDidMount() {
            AppState.addEventListener('change', this.onChangeAppState);
        }

        componentWillUnmount() {
            AppState.removeEventListener('change', this.onChangeAppState);
        }

        onChangeAppState = nextAppState => {
            const showSecurityScreen = showSecurityScreenFromAppState(nextAppState);

            this.setState({showSecurityScreen});
        };

        //this.state.showSecurityScreen
        render() {
            return ( …

我在做：

import React from 'react';
import PropTypes from 'prop-types';
import { TouchableOpacity, Linking } from 'react-native';

/**
 * Used to create external link to other websites
 */
class ExternalLink extends React.Component {
  _openLink = async () => {
    const { href } = this.props;
    if (await Linking.canOpenURL(href)) {
      await Linking.openURL(href);
    }
  };

  render() {
    const { href, children, ...rest } = this.props;
    return (
      <TouchableOpacity
        accessibilityRole="link"
        onPress={this._openLink} // eslint-disable-line no-underscore-dangle
        href={href}
        {...rest}
      >
        {children}
      </TouchableOpacity>
    );
  }
}

ExternalLink.propTypes = …

我正在开发一个 react-native 应用程序，当我尝试构建签名版本时，出现此错误：

任务 :app:mergeDexRelease 失败 AGPBI: {"kind":"error","text":"Type com.BV.LinearGradient.BuildConfig 被定义多次：/node_modules/react-native-linear-gradient/android/build/.transforms/aaad2255142356c3377f56df42cfb484/classes /classes.dex, /android/app/build/intermediates/external_libs_dex/release/out/classes.dex","sources":[{"file":"/node_modules/react-native-linear-gradient/android/build /.transforms/aaad2255142356c3377f56df42cfb484/classes/classes.dex"}],"tool":"D8"} com.android.builder.dexing.DexArchiveMergerException：合并dex档案时出错：类型com.BV.LinearG定义为多个时间：/node_modules/react-native-linear-gradient/android/build/.transforms/aaad2255142356c3377f56df42cfb484/classes/classes.dex,/android/app/build/intermediates/external_libs_dex/release/out/classes.dex 了解如何解决问题，请访问 https://developer.android.com/studio/build/dependencies#duplicate_classes. 在 com.android.builder.dexing.D8DexArchiveMerger.getExceptionToRethrow(D8DexArchiveMerger.java:132) 在 com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:119) 在 com.android.build.transgradle .DexMergerTransformCallable.call(DexMergerTransformCallable.java:102) 在 com.android.build.gradle.internal.tasks.DexMergingTaskRunnable.run(DexMergingTask.kt:445) 在 com.android.build.gradle.internal.tasks.Workers$ActionFacade .run(Workers.kt:348) at org.gradle.workers.internal.AdapterWorkAction.execute(AdapterWorkAction.java:50) at org.gradle.workers.internal.DefaultWorkerServer.execute(DefaultWorkerServer.java:47) at org. gradle.workers.internal.NoIsolationWorkerFactory$1$1$1.create(NoIsolationWorkerFactory.java:65) 在 org.gradle.workers.internal。

ps: buildToolsVersion = "28.0.3" minSdkVersion = 21
compileSdkVersion = 28 targetSdkVersion = 28 supportLibVersion = "28.0.0"