标签: react-native

假设我有一个像这样的渲染组件:

<View style={jewelStyle}></View>

jewelStyle =

  {
    borderRadius: 10,
    backgroundColor: '#FFEFCC',
    width: 20,
    height: 20,
  },

如何使背景颜色动态并随机分配？我试过了

  {
    borderRadius: 10,
    backgroundColor: getRandomColor(),
    width: 20,
    height: 20,
  },

但这使得View的所有实例都具有相同的颜色,我希望每个实例都是唯一的.

有小费吗？

如何在Android模拟器中启用实时重新加载？

android 的文档对于android noob来说并不是很有帮助.

我尝试创建看起来像现有Web应用程序的本机应用程序.我在窗口底部有一个固定的页脚.有人知道如何通过本机反应来实现这一目标吗？

在现有的应用程序中它很简单:

.footer {
  position: fixed;
  bottom: 0;
}

这是我使用过的视图样式

backCover: {
  position: 'absolute',
  marginTop: 20,
  top: 0,
  bottom: 0,
  left: 0,
  right: 0,
}

目前它有白色背景.我可以像我想要的那样更改backgroundColor,'#343434'但它只接受最大6个十六进制颜色,所以我不能给它提供不透明度'#00ffffff'.我试过像这样使用不透明度

backCover: {
  position: 'absolute',
  marginTop: 20,
  top: 0,
  bottom: 0,
  left: 0,
  right: 0,
  opacity: 0.5,
}

但它降低了视图内容的可见性.那么答案呢？

当我尝试启动我的本机应用程序时,我收到此消息.通常这种格式适用于其他多屏幕导航,但在某种程度上不适用于这种情况.

这是错误:

Invariant Violation: The navigation prop is missing for this navigator. In 
react-navigation 3 you must set up your app container directly. More info: 
https://reactnavigation.org/docs/en/app-containers.html

这是我的应用格式:

import React, {Component} from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createStackNavigator } from 'react-navigation';

import Login from './view/login.js'
import SignUp from './view/signup.js'

const RootStack = createStackNavigator(
  {
    Home: {
      screen: Login
    },
    Signup: {
      screen: SignUp
    }
  },
  {
    initialRouteName: 'Home'
  }

);

export default class App extends …

我目前正在尝试在Android模拟器上运行ES6 react-native-webpack-server.不同之处在于我升级了我package.json并build.grade使用react 0.18.0,并且在启动时遇到此错误.据我所知AppRegistry,正确导入.即使我要注释掉代码,这个错误仍然会出现.这在iOS上没有问题.

我究竟做错了什么？

编辑:尝试其他支持0.18.0的样板后,我仍然遇到同样的问题.

我正在研究MacOS并且刚开始react-native.

开始的第一步是运行:react-native run-android或react-native run-ios.但是我收到了这个错误:

react-native run-android

这是我跑步时得到的java --version:

Scanning folders for symlinks in /Users/ric/myprojs/albums/node_modules (6ms)
Starting JS server...
Building and installing the app on the device (cd android && ./gradlew installDebug)...

FAILURE: Build failed with an exception.

* What went wrong:
Could not determine java version from '9.0.1'.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
Could not …

使用componentDidMount()作为一个异步函数的良好做法作出反应本地还是应该避免呢？

我需要从AsyncStorage组件安装时获取一些信息,但我知道实现这一点的唯一方法是使componentDidMount()函数异步.

async componentDidMount() {
    let auth = await this.getAuth();
    if (auth) 
        this.checkAuth(auth);
}

这有什么问题,还有其他解决方案吗？

每当我跑步时react-native run-ios，我都会

Could not find iPhone X simulator

Error: Could not find iPhone X simulator
    at resolve (calendarPractice/node_modules/react-native/local-cli/runIOS/runIOS.js:149:13)
    at new Promise (<anonymous>)
    at runOnSimulator (calendarPractice/node_modules/react-native/local-cli/runIOS/runIOS.js:134:10)
    at Object.runIOS [as func] (calendarPractice/node_modules/react-native/local-cli/runIOS/runIOS.js:106:12)
    at Promise.resolve.then (calendarPractice/node_modules/react-native/local-cli/cliEntry.js:117:22)

但是，当我在Xcode上运行时，它工作正常

{
  "devicetypes" : [
    {
      "name" : "iPhone 4s",
      "bundlePath" : "\/Applications\/Xcode.app\/Contents\/Developer\/Platforms\/iPhoneOS.platform\/Developer\/Library\/CoreSimulator\/Profiles\/DeviceTypes\/iPhone 4s.simdevicetype",
      "identifier" : "com.apple.CoreSimulator.SimDeviceType.iPhone-4s"
    },
    {
      "name" : "iPhone 5",
      "bundlePath" : "\/Applications\/Xcode.app\/Contents\/Developer\/Platforms\/iPhoneOS.platform\/Developer\/Library\/CoreSimulator\/Profiles\/DeviceTypes\/iPhone 5.simdevicetype",
      "identifier" : "com.apple.CoreSimulator.SimDeviceType.iPhone-5"
    },
    {
      "name" : "iPhone 5s",
      "bundlePath" : "\/Applications\/Xcode.app\/Contents\/Developer\/Platforms\/iPhoneOS.platform\/Developer\/Library\/CoreSimulator\/Profiles\/DeviceTypes\/iPhone 5s.simdevicetype",
      "identifier" : "com.apple.CoreSimulator.SimDeviceType.iPhone-5s"
    },
    { …

在 MacBook Air M1 芯片中运行 npx react-native init appName 时

TypeError: cli.init is not a function
at run (/opt/homebrew/lib/node_modules/react-native-cli/index.js:302:7)
at createProject (/opt/homebrew/lib/node_modules/react-native-cli/index.js:249:3)
at init (/opt/homebrew/lib/node_modules/react-native-cli/index.js:200:5)
at Object.<anonymous> (/opt/homebrew/lib/node_modules/react-native-cli/index.js:153:7)
at Module._compile (node:internal/modules/cjs/loader:1112:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
at Module.load (node:internal/modules/cjs/loader:988:32)
at Module._load (node:internal/modules/cjs/loader:834:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47