uiwjs / react-iframe

This component allows you to wrap your entire React application or each component in an <iframe>.
https://uiwjs.github.io/react-iframe
MIT License
16 stars 2 forks source link

I hope to be able to add callback functions, such as mount and update. #6

Open Mrcxt opened 8 months ago

Mrcxt commented 8 months ago

I need to do something after the iframe has finished loading, and I need to use callback functions.

jaywcjlove commented 7 months ago

@Mrcxt

import React, { useEffect, useState, Fragment } from 'react';
import IFrame, { useFrame } from '@uiw/react-iframe';

const InnerComponent = () => {
  // Hook returns iframe's window and document instances from Frame context
  const { document, window } = useFrame();
  return (
    <div>
      <div>Hello World!</div>
    </div>
  );
};

export default function Demo() {
  const onLoad = (evn) => {
    console.log("iframe loaded successfully!", evn)
  }
  return (
    <IFrame onLoad={onLoad}>
      <InnerComponent />
    </IFrame>
  );
}