反应原生相机未定义答案

【问题标题】：react native camera undefined反应原生相机未定义
【发布时间】：2023-04-06 19:06:02
【问题描述】：

use strict';
import React, { Component } from 'react';
import {
  AppRegistry,
  Dimensions,
  StyleSheet,
  Text,
  TouchableHighlight,
  View
} from 'react-native';
import Camera from 'react-native-camera';

class BadInstagramCloneApp extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Camera
          ref={(cam) => {
            this.camera = cam;
          }}
          style={styles.preview}
          aspect={Camera.constants.Aspect.fill}>
          <Text style={styles.capture} onPress={this.takePicture.bind(this)}>[CAPTURE]</Text>
        </Camera>
      </View>
    );
  }
  takePicture() {
    this.camera.capture()
      .then((data) => console.log(data))
      .catch(err => console.error(err));
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  preview: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'center',
    height: Dimensions.get('window').height,
    width: Dimensions.get('window').width
  },
  capture: {
    flex: 0,
    backgroundColor: '#fff',
    borderRadius: 5,
    color: '#000',
    padding: 10,
    margin: 40
  }
});

AppRegistry.registerComponent('AwesomeProject', () => BadInstagramCloneApp);

我使用以下步骤来解决问题：删除 node_modules 文件夹 - rm -rf node_modules && npm install 重置打包程序缓存 - rm -fr $TMPDIR/react-* 或 node_modules/react-native/packager/packager.sh --reset-cache Clear watchman 手表 - watchman watch-del-all 从头开始重新创建项目但我仍然得到一个错误。

【问题讨论】：

你配置了react-native-camera组件的原生端了吗？

标签： camera react-native

【解决方案1】：

确保您已正确设置，包括运行$ react-native link react-native-camera 和其他按照documentation。

【讨论】：

嗨，我正在使用：github.com/expo/expo-docs/blob/… repo，它给了我这个错误：react-native link 不能在 Create React Native App 项目中使用。如果您需要包含依赖于自定义本机代码的库，您可能必须先弹出

【解决方案2】：

你可以尝试使用

var Camera = require('react-native-camera')

【讨论】：

你能详细说明一下吗？ OP有什么问题，为什么它不起作用，这是如何解决的......

【解决方案3】：

换行：

import Camera from 'react-native-camera';

用这一行：

import {RNCamera} from 'react-native-camera';

将<Camera></Camera> 标签更改为<RNCamera></RNCamera>。从 RNCamera 标签中移除 aspect 属性。

【讨论】：