javascript - 创建视频播放器(Quicktime 浏览器插件)React Elements，输出缺少的视频属性

Question

这是代码:

render: function () {
    switch (this.state.mime) {
      case "image":
        return React.createElement("img", React.__spread({}, this.props, { className: "img-responsive",
          src: this.state.url }));
      case "iframe":
        return React.createElement("iframe", React.__spread({}, this.props, { src: this.state.url }));
      case "rtmp":
        return React.createElement("embed", React.__spread({}, this.props, { src: this.state.streamUrl,
          type: "video/quicktime",
          autoPlay: true,
          qtsrc: this.state.streamUrl,
          target: "myself",
          scale: "tofit",
          controller: false,
          pluginspage: "http://www.apple.com/quicktime/download/",
          loop: "false" }));
      default:
        return React.createElement("span", null);
    }
  }

这是期望的输出:

<embed class="embed-responsive-item" src="rtsp://usr:pwd@10.0.1.12:10012" type="video/quicktime" autoplay="true" qtsrc="rtsp://10.0.1.12:10012" target="myself" scale="tofit" controller="false" pluginspage="http://www.apple.com/quicktime/download/" loop="false" data-reactid=".0.0.1.1.0.0.0.0">

这是我得到的:

<embed class="embed-responsive-item" src="rtsp://usr:pwd@10.0.1.12:10012" type="video/quicktime" autoplay="" target="myself" loop="" data-reactid=".0.0.1.1.0.0.0.0">

• 缺少元素:自动播放值、qtsrc 和值、比例、 Controller 、pluginspage 和值、循环值；想不通原因。提前感谢您的帮助!

Answer 1

你可以这样试试

   var App = React.createClass({
   getInitialState: function(){
      return {'streamUrl' : 'http://google.com'};
   },
   render: function(){
      return React.createElement("embed", { src: this.state.streamUrl,
      type: "video/quicktime",
      autoPlay: true,
      "data-qtsrc": this.state.streamUrl,
      target: "myself",
      "scale": "tofit",
      "data-controller": false,
      "data-pluginspage": "http://www.apple.com/quicktime/download/",
      loop: "false" }, this.props);
   }
 });

这是一个DEMO