代码分析
IFrame.js
这段代码定义了它的布局属性,长宽高,自适应性,对于信息的处理
class IFrame extends react_1.default.Component {
constructor() {
super(...arguments);
this.IFrameRef = react_1.default.createRef();
this.state = {
width: this.props.width || '100%',
height: this.props.height || '100%'
};
}
componentDidMount() {
window.addEventListener('message', this.onMessage);
}
componentDidUpdate(prevProps) {
const data = this.props.data;
if (data !== prevProps.data) {
this.postMessage('update', data);
}
else if (this.props.width !== prevProps.width ||
this.props.height !== prevProps.height) {
this.setState({
width: this.props.width || '100%',
height: this.props.height || '100%'
});