组件异常元素类型在本机反应中无效

Question

在我的 React Native App.js 中，我有以下代码

import { StatusBar } from 'expo-status-bar';
import React, { useRef, Component } from 'react';
import { StyleSheet, Text, View, Canvas } from 'react-native';
import { RNCamera } from "react-native-camera";
import * as tf from '@tensorflow/tfjs';
import * as handpose from '@tensorflow-models/handpose';

export default function App() {
  const webcamRef = useRef(null);
  const canvasRef = useRef(null);
  return (
    <View style={styles.container}>
      <RNCamera ref={webcamRef}
        style={{
          position: 'absolute',
          marginLeft: 'auto',
          marginRight: 'auto',
          left: 0,
          right: 0,
          textAlign: 'center',
          zIndex: 9,
          height: 480,
          width: 640
        }}
      />
      <Canvas ref={canvasRef}
        style={{
          position: 'absolute',
          marginLeft: 'auto',
          marginRight: 'auto',
          left: 0,
          right: 0,
          textAlign: 'center',
          zIndex: 9,
          height: 480,
          width: 640
        }}
      />
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

上面的代码说：

元素类型无效：应为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入

Answer 1

我认为react-native 中没有Canvas 组件。您正在尝试导入实际 react-native 框架中不存在的内容。

从react-native 中删除导入Canvas。

要实现画布，可以改用这个插件https://www.npmjs.com/package/react-native-canvas