react html2canvas 传参

在React中，`html2canvas`是一个用于将HTML内容转换为图片的库，常用于生成PDF或截图功能。当你需要将其集成到组件中并传递参数时，通常会通过props的方式进行。以下是一个简单的例子：

import React from 'react';
import html2canvas from 'html2canvas';

const CanvasComponent = ({ elementRef, options }) => {
  const handleRender = async () => {
    try {
      // 使用elementRef获取实际的DOM元素
      const elem = elementRef.current;
      const canvas = await html2canvas(elem, options); // 传入options参数
      const base64Data = canvas.toDataURL();
      // ... 进行后续处理，比如下载或显示图片
    } catch (error) {
      console.error('Error converting to canvas', error);
    }
  };

  return (
    <div ref={elementRef}>
      {/* 渲染你的UI */}
      <p>这是一个要转成图片的内容</p>
      <button onClick={handleRender}>渲染到canvas</button>
    </div>
  );
};

// 使用时传递参数
<CanvasComponent elementRef={React.createRef()} options={{ backgroundColor: 'white', logging: true }} />

这里的`options`参数可以包含如背景颜色、是否显示开发者日志等配置项。具体的选项取决于`html2canvas`库的文档。