Cordova摄像头插件无法在反应js组件中工作

问题描述：

我正在构建PhoneGap混合应用程序，其中包含使用cordova摄像头插件的反应js和react-router。我使用PhoneGap开发人员应用程序在iPhone上测试应用程序。问题在于相机不会显示在按钮上。任何帮助将不胜感激。下面是摄像头组件代码：运行在浏览器中的应用程序，然后采取建立使用NPM运行构建Cordova摄像头插件无法在反应js组件中工作

import React from 'react'; 
import '../css/poc-form.css'; 
import '../css/POCButton.css'; 

class Camera extends React.Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
     value: '' }; 

     this.takePicture = this.takePicture.bind(this); 
    } 

takePicture(event) { 
     alert('take a picture'); 
     navigator.camera.getPicture(onSuccess, onFail, { 
     quality: 50, 
     destinationType: Camera.DestinationType.DATA_URL, 
     sourceType: Camera.SourceType.CAMERA 
    }); 

    function onSuccess(imageData) { 
     var image = document.getElementById('myImage'); 
     image.src = "data:image/jpeg;base64," + imageData; 
    } 

    function onFail(message) { 
     alert('Failed because: ' + message); 
    } 
    event.preventDefault(); 
} 


render() { 
     return (
     <div> 
      <link rel="stylesheet" type="text/css" href="poc.css"/> 
     <h1>Client ID Scanner</h1> 
      <button id = "takePicture" className = "POCButton" onClick={this.takePicture} >Take Picture</button> 
      <img id = "myImage" ></img> 
     </div> 
    ); 
    } 
    } 
    export default Camera;

答

1.一旦 - -p在反应项目，一旦其get完成了建造，请复制www文件夹在你的反应项目

2.done你在Xcode科尔多瓦创建示例应用程序下面的 https://cordova.apache.org/docs/en/latest/guide/cli/

三曾任只是这台相机的插件添加到项目中 科尔多瓦插件添加科尔多瓦 - 插件相机 https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/

然后分阶段地科尔多瓦的应用程序的文件夹，请粘贴在科尔多瓦项目中的以下文件夹WWW

5.then最后运行的iPod科尔多瓦项目或idevices.it将work.hope它可以帮助你

开始=“4”>

Cordova摄像头插件无法在反应js组件中工作

相关推荐