Question

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＆amp;＆amp; npm安装重置打包缓存 - rm -fr $ TMPDIR / react- *或node_modules / react-native / packager / packager.sh --reset-cache 清晰的守望者手表 - 守望者手表 - 所有从头开始重新创建项目但我仍然有错误。

Answer 1

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

Answer 2

您可以尝试使用

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

Answer 3

替换行：

import Camera from 'react-native-camera';

此行：

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

将<Camera></Camera>标记更改为<RNCamera></RNCamera>。从RNCamera标签中删除Aspect属性。

反应原生相机未定义

3 个答案: