saveToCameraRoll 不是函数

Posted 2023-03-11

【中文标题】saveToCameraRoll 不是函数

【英文标题】：saveToCameraRoll is not a function

【发布时间】：2019-04-26 09:11:17

【问题描述】：

我正在尝试将使用 React Native Camera 库拍摄的图像发送到相机胶卷。

当用户按下按钮时，会触发以下功能：

  takePicture = async function() 
    if (this.camera) 
      const options =  quality: 0.5, base64: true 
      const data = await this.camera.takePictureAsync(options)
      CameraRoll.saveToCameraRoll(data.uri)
    
  

我已经知道应用程序将图片发送到缓存文件夹，因为执行此代码后会显示图片的链接：

  takePicture = async function() 
    if (this.camera) 
      const options =  quality: 0.5, base64: true 
      const data = await this.camera.takePictureAsync(options)
      console.log(data.uri)
    
  

调试器显示以下错误：

Possible Unhandled Promise Rejection (id:0)
React Native Camera: TypeError: _reactNative.default.saveToCameraRoll is not a function

Cam组件的代码：

import React, Component from 'react';
import StyleSheet, View from 'react-native'
import  RNCamera  from 'react-native-camera'
import CameraRoll from 'react-native'
import ActionButton from 'react-native-action-button'
import Icon from 'react-native-vector-icons/Ionicons'

const styles = StyleSheet.create(
  container: 
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  ,

  button: 
    height: 200,

    justifyContent: 'flex-end',
    alignItems: 'center'
  ,

  actionButtonIcon: 
    fontSize: 20,
    height: 22,
    color: 'white',
  ,

);


export default class Cam extends Component 
  constructor() 
    super()
    this.takePicture = this.takePicture.bind(this)
  

  takePicture = async function() 
    if (this.camera) 
      const options =  quality: 0.5, base64: true 
      const data = await this.camera.takePictureAsync(options)
      CameraRoll.saveToCameraRoll(data.uri)
    
  

  render() 
    return (
      <View style=styles.container>

        <RNCamera
          ref=ref => this.camera = ref
          style=
            flex: 1,
            width: '100%',
            position: 'relative'
          
        >
        </RNCamera>

        <ActionButton size=80 useNativeFeedback=false buttonColor="rgba(231,76,60,1)">
          <ActionButton.Item useNativeFeedback=false buttonColor='#9b59b6' title="Settings" onPress=this.props.switchScreen>
            <Icon name="md-create" style=styles.actionButtonIcon />
          </ActionButton.Item>
          <ActionButton.Item useNativeFeedback=false buttonColor='#1abc9c' title="Start" onPress=this.takePicture>
            <Icon name="md-done-all" style=styles.actionButtonIcon />
          </ActionButton.Item>

        </ActionButton>

      </View>
    )
  

【问题讨论】：

这只是来自 React 的一些调试信息，还是实际失败？

只有一点调试信息。尽管拍摄的照片没有发送到相机胶卷，但该应用程序仍在继续工作。

yourCameraRoll 导入的样子如何？

用所有代码更新了我的初始帖子。

谢谢，现在我要做的就是设置权限。看来行得通！

【参考方案1】：

看看这个example如何使用CameraRoll：

import 
  View,
  Text,
  TouchableHighlight,
  Modal,
  StyleSheet,
  Button,
  CameraRoll,
  Image,
  Dimensions,
  ScrollView,
 from 'react-native'

---

你必须更换：

import CameraRoll from 'react-native';

通过

import  CameraRoll  from 'react-native';

（我已将其作为答案，以便可以接受并关闭问题）

---

---

在您的代码中，您可以将导入相互化：

import React, 
  Component,
 from 'react';

import  
   RNCamera,
 from 'react-native-camera';

import 
  CameraRoll,
  StyleSheet,
  View,
 from 'react-native';

import ActionButton from 'react-native-action-button';

import Icon from 'react-native-vector-icons/Ionicons';