小编jar*_*App的帖子

我有简单的组件

class ContentEditable extends React.Component {
  constructor(props) {
    super(props);
    this.handleInput = this.handleInput.bind(this);
  }

  handleInput(event) {
    let html = event.target.innerHTML;
    if (this.props.onChange && html !== this.lastHtml) {
      this.props.onChange({ target: { value: html, name: this.props.name } });
      this.lastHtml = html;
    }
  }

  render() {
    return (
      <span
        contentEditable="true"
        onInput={this.handleInput}
        className={"auto " + this.props.className}
        dangerouslySetInnerHTML={{ __html: this.props.value }}
      />
    );
  }
}
export default ContentEditable;

<ContentEditable
  value={this.state.name}
  onChange={e => {
    this.setState({ name: e.target.value });
  }}
/>;

组件有效,但我的光标始终位于第一个位置,而不是渲染文本.

我在这个论坛上测试了一些例子,但它对我不起作用.

我使用React 15.6.1并在chrome(Os X)上测试它.我有什么提示可以解决这个问题吗？

当我通过优化器测试页面时,它建议我对我使用的所有CDN源使用异步.

运行我使用的任何脚本

(function(){})();

我也使用内联script标签的javascript代码.如何运行内联脚本,如:

<script>
(function(){
jQuery.foundation();
ReactDOM.render(<App />,document.querySelector('#app'));
});
</script>

？我已经尝试过异步标记,但它不起作用.我有错误,不存在由async加载的库.

我使用 React 在页面上以正确的大小设置带有 youtube 视频的 iframe。一切正常，但对于手机而言，自动播放选项不起作用。

什么是有趣的页面，我有什么作为示例视频它完美无缺。

<iframe type="text/html"  allowTransparency="true"  height="100%" width="100%" preload="metadata" gesture="media" allow="encrypted-media" className="autoplay-iframe"
            src={`https://www.youtube.com/embed/`+this.props.autoplay+`?autoplay=1&version=3&html5=1&hd=1&controls=0&loop=1&playlist=`+this.props.autoplay+`&playsinline=1&rel=0&showinfo=0&modestbranding=1&related=0&enablejsapi=1&origin=`+window.location.hostname} frameborder="0"></iframe>

上面是我的 iframe 代码。我剪掉了 iframe 代码的一部分，但样式属性中只有样式。这对于自动播放并不重要。其他页面的最终 url 相同。我不知道为什么。任何提示我如何解决这个问题？

提前致谢。