Question

我正在使用React构建一个网页，这意味着我无法直接操作DOM。我已经尝试通过更新url状态重新加载我的iframe，但似乎没有重新加载页面。这是我尝试过的州代码。

componentDidMount: function() {
    setInterval(function(){
        this.setState({currentUrl:currentUrl});
    }.bind(this), 1000);
},
 getInitialState: function() {
    return {defaultUrl:this.props.graph.url, currentUrl:this.props.graph.url};
},
render() {
    // render the graph iframe
    return (
        <iframe src={this.state.currentUrl} id={this.props.graph.url} style={this.props.style} width={this.props.width} height={this.props.graph_height} />
    )
}

Answer 1

更改组件的键属性例如：

this.state = {iframeKey: 0};

setInterval(() => this.setState(s => ({iframeKey: s.iframeKey + 1})), 1000);

<Iframe key={this.state.iframeKey} url={some url}/>

Answer 2

如果我假设iframe的内容不在反应控制之下，那么这是ref属性的用例。将一个应用于iframe，然后使用setInterval刷新iframe网址。

当您将URL设置为状态时，iframe未更新的原因是url未更改（？）并且在这种情况下反应不会重绘。

Answer 3

我发布了一个不同的问题，为我解答了这个问题。请在此处查看答案：How to use forceUpdate() correctly?

使用React定期重新加载iframe的最佳方法是什么？

3 个答案: