如何从API获取img(React/TypeScript)



问题是,当文件不上传时,我只看到图标。提前感谢您的帮助。

import React, { FC } from "react";
import { IUser } from "../types/Types";
import App from "../App";
interface UserItemProps {
user: IUser;
}
const UserItem: FC<UserItemProps> = ({ user }) => {
return (
<body>
<article className="UserPage">
<h2 className="Title_options ">
{user.title} <h6 className="Name">{user.name}</h6>
<h6>{user.address}</h6>
</h2>
<img src={user.pictures} />
</article>
</body>
);
};
export default UserItem;

类型

export interface IUser {
name: string;
title: string;
headers: string;
id: number;
email: string;
address: string | number;
pictures: string;
}

API[1]

[1]: https://i.stack.imgur.com/9uISi.png

[在Chrome中的外观][2]

[2]: https://i.stack.imgur.com/wBaZ8.png

替换此:

<img src={user.pictures} />

这个:

{user.pictures && user.pictures.map(picture => (<img src={picture} />)}

最新更新