Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@u007
Last active October 19, 2017 16:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save u007/4ae63985f392f5e56e3746d7c9d0a54a to your computer and use it in GitHub Desktop.
Save u007/4ae63985f392f5e56e3746d7c9d0a54a to your computer and use it in GitHub Desktop.
react and iframe without rerendering
'use strict';
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
var input, wrapper
class StaticIframeComponent extends Component {
constructor(props) {
super(props)
this.state = {}
this.baseUrl = window.location.protocol + "//" + window.location.host
}
componentDidMount() {
//this.updatableFields = ["className", "src"]
const inputOption = {
}
//console.log("option", inputOption)
}
shouldComponentUpdate(nextProps, nextState) {
//console.log("should update?")
return false
}
componentWillReceiveProps(nextProps) {
const newSrc = nextProps.src.startsWith("http:") || nextProps.src.startsWith("https:") ? nextProps.src : this.baseUrl + nextProps.src
if(nextProps['src'] && newSrc != this.props.src) {
console.log("src changed", newSrc, 'last', this.props.src)
this.iframe.src = nextProps['src']
}
if(nextProps['onLoad'] && nextProps.onLoad != this.props.onLoad) {
this.iframe.setAttribute("onLoad", nextProps['onLoad'])
}
if(nextProps['id'] && nextProps.id != this.props.id) {
this.iframe.setAttribute("id", nextProps['id'])
}
}
setIframe(i) {
this.iframe = i
//console.log("iframe?", i)
if(this.props['setiframeref']) {
this.props.setiframeref(i)
}
}
render() {
let props = {}
for (let [key, value] of Object.entries(this.props)) {
if(key != 'setiframeref') {
props[key] = value
}
}
return (
<iframe {...props} ref={(i) => { this.setIframe(i) } }>
</iframe>
)
}//render
}
const mapStateToProps = (state) => {
return {
}
}
const mapDispatchToProps = (dispatch) => {
return {
}
}
const StaticIframe = connect(
mapStateToProps,
mapDispatchToProps
)(StaticIframeComponent)
export default StaticIframe
<StaticIframe src={url} width={this.props.width || 910} height={this.props.height || 1287}
className="anyclassnames" style={{float: "left"}}
setiframeref={(i) => this.setIframe(i)}
></StaticIframe>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment