表情包制作app

import React, { useState } from 'react';
import { Upload, Input, Button, Image } from 'antd';

const EmojiMaker = () => {
  const [image, setImage] = useState(null);
  const [text, setText] = useState('');

  const handleImageUpload = (file) => {
    setImage(URL.createObjectURL(file));
  };

  const handleTextChange = (e) => {
    setText(e.target.value);
  };

  const handleSubmit = () => {
    // 这里可以添加导出表情包的逻辑
    console.log('Image:', image);
    console.log('Text:', text);
  };

  return (
    <div>
      <Upload onChange={handleImageUpload}>
        <Button>上传图片</Button>
      </Upload>
      {image && <Image src={image} alt="Uploaded" />}
      <Input placeholder="添加文字" value={text} onChange={handleTextChange} />
      <Button onClick={handleSubmit}>生成表情包</Button>
    </div>
  );
};

export default EmojiMaker;