2016-08-24 82 views
0
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文件夾 - 室射頻node_modules & & NPM安裝 復位打包緩存 - RM -fr $ TMPDIR/react- *或node_modules /react-native/packager/packager.sh --reset-cache 清除守衛員手錶 - 守望員手錶全部刪除 從零開始重新創建項目 但我仍然收到錯誤消息。反應機攝像頭未定義

+0

你配置了'反應,本機camera'組件的本機端? –

回答

1

確保您已正確設置設置,包括根據documentation運行$ react-native link react-native-camera和其他設置。

+0

嗨,我正在使用:https://github.com/expo/expo-docs/blob/8dfaa440335ab2a70ce609b8c72d99246791598b/versions/unversioned/sdk/camera.md回購,它給了我這個錯誤:'react-native link'不能用於創建React Native App項目。如果您需要包含依賴自定義本機代碼的庫,則可能必須先彈出 –

0

你可以嘗試使用

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

您可以詳細說明它嗎? OP有什麼問題,爲什麼它不起作用,這是怎麼解決的呢...... – Shirkam