React Mirror
Create synchronized replicas of a React DOM element.
Usage
See equivalent uses of the hook and component below.
useMirror
hook
import { useMirror } from 'react-mirror';
function App() {
const [ref, reflection] = useMirror({ className: 'mirror-frame' });
return (
<>
<div ref={ref} />
{reflection}
<>
);
}
<Mirror />
component
import React from 'react';
import { Mirror } from 'react-mirror';
function App() {
const [reflect, setReflect] = React.useState(null);
return (
<>
<div ref={setReflect} />
<Mirror reflect={reflect} className='mirror-frame'/>
<>
);
}