我是如何在react中把一个集成了html,css的内容放到页面中的

我是如何在react中把一个集成了html,css的内容放到页面中的

首先把html,css内容进行一个变量化,然后利用useState()去初始化一个变量,最后同通过一个标签属性就好了dangerouslySetInnerHTML={变量}

tsx 复制代码
import React, {useEffect, useState} from "react";
import {contentHtml} from "@/pages/Developer/constant";
const Developer: React.FC = () => {
    const [html, setHtml] = useState('');

    useEffect(() => {
      setHtml(contentHtml)
    }, []);

    return (
      <div dangerouslySetInnerHTML={{ __html: html }} />
    );
}
export default Developer;

通过这样我把 typora 导出的 html 就可以直接放到上面展示了。

相关推荐
小李小李不讲道理5 小时前
「Ant Design 组件库探索」四:Input组件
前端·javascript·react.js
小*-^-*九6 小时前
php 使用html 生成pdf word wkhtmltopdf 系列2
pdf·html·php
BillKu6 小时前
vue3 样式 css、less、scss、sass 的说明
css·less·sass·scss
乖女子@@@9 小时前
css3新增-网格Grid布局
前端·css·css3
Sapphire~11 小时前
重学前端013 --- 响应式网页设计 CSS网格布局
前端·css
二十雨辰13 小时前
歌词滚动效果
前端·css
知识分享小能手13 小时前
React学习教程,从入门到精通,React AJAX 语法知识点与案例详解(18)
前端·javascript·vue.js·学习·react.js·ajax·vue3
hashiqimiya14 小时前
html实现右上角有个图标,鼠标移动到该位置出现手型,点击会弹出登录窗口。
前端·html
BillKu17 小时前
Vue3 中使用 DOMPurify 对渲染动态 HTML 进行安全净化处理
前端·安全·html
NeverSettle_17 小时前
React工程实践面试题深度分析2025
javascript·react.js