使用react原生相机拍照，并将照片传送到另一个屏幕

import React, { useState, useRef } from 'react';

const CameraComponent = () => {
  const videoRef = useRef(null);
  const [photo, setPhoto] = useState(null);

  const handleCapture = () => {
    const video = videoRef.current;

    if (video && video.readyState === video.HAVE_ENOUGH_DATA) {
      const canvas = document.createElement('canvas');
      canvas.width = video.videoWidth;
      canvas.height = video.videoHeight;

      const context = canvas.getContext('2d');
      context.drawImage(video, 0, 0, video.videoWidth, video.videoHeight);

      const dataURL = canvas.toDataURL('image/jpeg');
      setPhoto(dataURL);
    }
  };

  return (
    <div>
      <video ref={videoRef} autoPlay />
      <button onClick={handleCapture}>拍照</button>
      {photo && <PhotoComponent photo={photo} />}
    </div>
  );
};

const PhotoComponent = ({ photo }) => {
  return <img src={photo} alt="照片" />;
};

export default CameraComponent;