为什么设置iframe的allowfullscreen属性似乎不保留该属性

Question

在我的代码中，我设置了我的iframe的allowfullscreen属性，该属性被SkyLight包围，SkyLight是react.js中模态视图的npm模块

            <SkyLight dialogStyles={myBigGreenDialog} hideOnOverlayClicked ref="simpleDialog">
              <iframe src=url frameborder="0" width="960" height="569" allowfullscreen="true"></iframe>;
            </SkyLight>

但是，当我检查页面时，iframe没有属性allowfullscreen：

allowfullscreen="true"但是，当我在控制台中手动添加属性时，iframe可以全屏显示。

有谁知道如何确保allowfullscreen属性存在而无需通过控制台手动添加它？

Answer 1

请参阅文档。

React是区分大小写的，该属性称为allowFullScreen，而不是allowfullscreen。它也是一个布尔属性，因此true不是有效值。

<iframe src="http://example.com" frameborder="0" width="960" height="569" allowFullScreen></iframe>

观看现场演示