React Native CameraRoll 未定义
React Native CameraRoll being undefined
这是我使用 React Native 社区相机胶卷的功能组件。它主要是从 github 的自述文件中的示例复制而来:https://github.com/react-native-cameraroll/react-native-cameraroll
我确实在 android 11 phone 上使用 expo 应用程序来测试和调试 rn 应用程序。
import * as React from 'react';
import {PermissionsAndroid, Platform, ScrollView, Image} from 'react-native';
import {Text, View} from "./Themed";
import CameraRoll, {PhotoIdentifier} from '@react-native-community/cameraroll';
import {useState} from 'react';
type CameraRollButtonProps = {}
export default function CameraRollButton({}: CameraRollButtonProps) {
const [photos, setPhotos] = useState<PhotoIdentifier[]>([]);
async function hasAndroidPermission() {
const permission = PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE;
const hasPermission = await PermissionsAndroid.check(permission);
if (hasPermission) {
return true;
}
const status = await PermissionsAndroid.request(permission);
return status === 'granted';
}
const onPress = async () => {
if (Platform.OS === "android" && !(await hasAndroidPermission())) {
return;
}
CameraRoll.getPhotos({
first: 20,
assetType: 'Photos',
})
.then(r => {
setPhotos(r.edges);
})
.catch((err) => {
console.log("error catched: " + err);
})
};
return (
<View>
<Text onPress={onPress}>
Camera Roll
</Text>
<ScrollView>
{photos.map((p, i) =>
<Image
key={i}
style={{
width: 300,
height: 100,
}}
source={{uri: p.node.image.uri}}
/>
)}
</ScrollView>
</View>
);
}
当我第一次按下按钮时,我得到了我点击允许的权限提示。然后我得到这个错误:
[Unhandled promise rejection: TypeError: Cannot read properties of undefined (reading 'getPhotos')]
at node_modules/@react-native-community/cameraroll/js/CameraRoll.js:205:32 in saveToCameraRoll
at components/CameraRollButton.tsx:34:19 in onPress
我通过 sudo npm i @react-native-community/cameraroll --save
安装了模块。稍后我也尝试从自述文件中执行这一行:react-native link @react-native-community/cameraroll && npx pod-install
。它似乎没有做任何事情,据我所知我不需要它,因为有自动链接。
我还删除了 node_modules 并重新安装了所有内容。仍然是同样的错误。我还尝试通过 expo install
.
安装模块
我仍然不确定问题出在哪里,但我想使用 expo 可能是个问题。我忘记了 expo 附带了很多模块,所以我最终使用 https://docs.expo.dev/versions/v42.0.0/sdk/media-library/ 没有任何问题。
这是我使用 React Native 社区相机胶卷的功能组件。它主要是从 github 的自述文件中的示例复制而来:https://github.com/react-native-cameraroll/react-native-cameraroll
我确实在 android 11 phone 上使用 expo 应用程序来测试和调试 rn 应用程序。
import * as React from 'react';
import {PermissionsAndroid, Platform, ScrollView, Image} from 'react-native';
import {Text, View} from "./Themed";
import CameraRoll, {PhotoIdentifier} from '@react-native-community/cameraroll';
import {useState} from 'react';
type CameraRollButtonProps = {}
export default function CameraRollButton({}: CameraRollButtonProps) {
const [photos, setPhotos] = useState<PhotoIdentifier[]>([]);
async function hasAndroidPermission() {
const permission = PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE;
const hasPermission = await PermissionsAndroid.check(permission);
if (hasPermission) {
return true;
}
const status = await PermissionsAndroid.request(permission);
return status === 'granted';
}
const onPress = async () => {
if (Platform.OS === "android" && !(await hasAndroidPermission())) {
return;
}
CameraRoll.getPhotos({
first: 20,
assetType: 'Photos',
})
.then(r => {
setPhotos(r.edges);
})
.catch((err) => {
console.log("error catched: " + err);
})
};
return (
<View>
<Text onPress={onPress}>
Camera Roll
</Text>
<ScrollView>
{photos.map((p, i) =>
<Image
key={i}
style={{
width: 300,
height: 100,
}}
source={{uri: p.node.image.uri}}
/>
)}
</ScrollView>
</View>
);
}
当我第一次按下按钮时,我得到了我点击允许的权限提示。然后我得到这个错误:
[Unhandled promise rejection: TypeError: Cannot read properties of undefined (reading 'getPhotos')] at node_modules/@react-native-community/cameraroll/js/CameraRoll.js:205:32 in saveToCameraRoll at components/CameraRollButton.tsx:34:19 in onPress
我通过 sudo npm i @react-native-community/cameraroll --save
安装了模块。稍后我也尝试从自述文件中执行这一行:react-native link @react-native-community/cameraroll && npx pod-install
。它似乎没有做任何事情,据我所知我不需要它,因为有自动链接。
我还删除了 node_modules 并重新安装了所有内容。仍然是同样的错误。我还尝试通过 expo install
.
我仍然不确定问题出在哪里,但我想使用 expo 可能是个问题。我忘记了 expo 附带了很多模块,所以我最终使用 https://docs.expo.dev/versions/v42.0.0/sdk/media-library/ 没有任何问题。