0

我正在制作一个网站,我需要显示每个project. 因此,我从 DB 字段上的简单 TEXT() 开始,但输出是完整的块文本……然后,我用 description.txt 将我的 DB 上的 TEXT() 替换为 BLOB(),但出乎意料文本也没有格式化,它仍然是文本块。在此之后将 description.txt 更改为 description.html (正确),输出读取为 .text :/ (我的意思是这不是作为 html 文件读取的)。有我的 NodeJS 代码:

router.get("/:idProject/description", (req, res) => {
    const { idProject } = req.params;
    const sql = "SELECT p.description FROM project AS p WHERE id = ? ";
    connection.query(sql, [idProject], (err, result) => {
        if (err) {
            res.status(500).send("Impossible de trouver le projet");
        } else {
            const convertBufferToString = Buffer.from(result[0].description);

            res.status(200).send(convertBufferToString);
        }
    });
});

还有我的 ReactJS 代码:

function Description({ projectName, url }) {
    const { id } = useParams();
    const [description, SetDescription] = useState(null);

    const getDescription = (idProject) => {
        const projectURL = `${process.env.REACT_APP_HOST}/projects/${idProject}/description`;
        Axios.get(projectURL)
            .then((response) => response.data)
            .then((data) => SetDescription(data));
    };
    useEffect(() => {
        getDescription(id);
    }, [id]);

    return (
        <React.Fragment>
            <Typography variant="h3">{projectName}</Typography>
            <Typography paragraph variant="body1">
            </Typography>
            <Link href={url}> Lien du site</Link>
                {description ? description : "Description du projet"}
        </React.Fragment>
    );
}

export default Description

我尝试了很多东西,比如新的 Blob、新的文件、新的 FileReader 等,但我不知道如何解决这个问题。所以我的问题是:如果可能的话,我如何在 ReactJS 中将 res.send(BLOB 或 Buffer) 读取为 HTML?相反,有什么建议可以通过 project.id 获得格式化的描述吗?

提前,非常感谢!

4

1 回答 1

0

感谢我的同学巴斯蒂斯特,他找到了解决方案:

在反应:

return (
        <React.Fragment>
            <Typography variant="h3">{projectName}</Typography>
            <Typography paragraph variant="body1" dangerouslySetInnerHTML={{ __html: description }}/>
            <Link href={url}> Lien du site</Link>
        </React.Fragment>
    );

完整指南做出危险的反应setinnerhtml

现在的输出符合预期!感谢他

于 2020-08-07T08:58:41.937 回答