reactjs - 在 ReactJs JSX 中设置属性 mozallowfullscreen 或 webkitAllowFullScreen

Question

我正在尝试在这样的网页中包含 Vimeo Iframe（JSX 代码）：

<iframe frameBorder="0" width="100%" height="100%" src={this.props.src} webkitAllowFullScreen mozAllowFullScreen allowFullScreen />

渲染的是这样的：

<iframe frameborder="0" width="100%" height="100%" src="https://player.vimeo.com/video/..." allowfullscreen=""></iframe>

如何实现所需的 mozAllowFullScreen 和 webkitAllowFullScreen 属性？在 React Docs ( https://facebook.github.io/react/docs/dom-elements.html#all-supported-html-attributes ) 中只提到了 allowfullscreen 属性？

Answer 1

尝试true作为字符串传递。这对我有用（反应 16）：

<iframe 
  frameBorder="0"
  width="100%" height="100%" 
  src={this.props.src}
  allowFullScreen="true"
  webkitallowfullscreen="true"
  mozallowfullscreen="true"
/>

更多细节在这里：https ://github.com/facebook/react/issues/7848

Answer 2

像这样的东西应该工作：

<iframe frameborder="0" width="100%" height="100%"
    src={this.props.src} webkitAllowFullScreen={true}
    mozAllowFullScreen={true} allowFullScreen={true} />