如何在reactjs中将数据二进制转换为图像？

我已经在尝试这个，但它仍然对我不起作用如何在reactjs中将二进制数据转换为图像 https://stackoverflow.com/questions/41972435/how-to-convert-the-binary-data-to-image-in-reactjs

这是我的代码

        return axios.post(`${API_MOBILE}/${path}`, formData, {
            headers: {
              'Content-Type': 'multipart/form-data',
            },
        })
        .catch((error) => {
            if (error.response) {
                return Promise.reject({
                    message: error.response.data.error,
                    code: error.response.status
                });
            } else if (error.request) {
              console.log(error.request);
              throw error;
            } else {
              console.log('Error', error.message);
              throw error;
            }
        });
    },

这里是控制器

try {
        let { detail } = yield select(state => state.user);
        const result = yield call(API.generateMotif, payload, detail.api_token);
        
        yield put({
            type: types.GENERATE_MOTIF_SUCCESS,
            payload: result,
        });

    } catch (err) {
        yield put(handleError(err));

        yield put({
            type: types.GENERATE_MOTIF_FAILURE,
            payload: err,
        });
    }

这是我的前端

<div className="box-body">
                        { props.uploading 
                            ? (
                                <div>
                                    <img src={props.image} alt="upload placeholder"/>
                                    <Spinner />
                                </div>
                            )
                            
                            : props.generated !== ''
                                ? <img src={"data:;base64,"+props.generated} alt="generated motif"/>
                                : <AddPhotoAlternate className="icon-large"/>
                        }
                    </div>

GenerateM.propTypes = {
    image: PropTypes.string.isRequired,
    generated: PropTypes.string,
    list: PropTypes.array,
    uploading: PropTypes.bool.isRequired,
    imageChange: PropTypes.func.isRequired,
};

In my console, generated has data binary, so I found solutions in that link that I post, but it still not working for me. Response that I want, in my frontend show image, but here the response that I got it just snippet of response that I copying from Postman, when I copying from my console it just has copying nothing. ����JFIF��C $.' ",#(7),01444'9=82<.342��C 2!!22222222222222222222222222222222222222222222222222��"�� ���}!1AQa"q2���#B��R��$3br� %&'()*456789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz��������������������������������������������������������������������������� ���w!1AQaq"2�B���� #3R�br� like in this picture

您有什么解决方案可以帮助我吗？拜托，任何建议都会对我很有帮助。

你可以这样做：

<img src={`data:image/*;base64,${props.generated}`} alt="generated motif" />

但您必须确保 API 的响应是可以解码的。

请参阅 PHP 的base64_encode() https://www.php.net/manual/en/function.base64-encode.php and 这个 Stackoverflow 答案 https://stackoverflow.com/a/42399865/11722883.