如何使用 React 编辑 iframe 中的样式?

Question

我需要在反应组件中渲染一个 iframe，但想在其中隐藏一个元素。不过，iframe的域是外部的。

有什么方法可以在iframe中注入自定义 CSS 并做我需要的吗？

这是我的组件：

import React from 'react'
const ExampleComponent = () => {
return ( <>
<iframe src="https://app.sli.do/event/6ouwoyzr"></iframe>
</> );
}

export default ExampleComponent;

还有我想注入的css：

app-header {
display: none;
}

Answer 1

U 应该jsx.你可以在标签iframe**className**属性，你可以在里面编写一些jsx代码，或者你可以创建类并在className中给出它。例如：

风格.css：

.Burger{
width:100px;
height:100px
}

反应文件：

import classesfrom 'your.css.file.path.css';
<iframe className={classes.Burger}>

您也可以查看此链接，了解进入我们的组件样式的其他方式： https://material-ui.com/styles/basics/