31 lines
773 B
TypeScript
31 lines
773 B
TypeScript
|
import TextareaAutosize from '@mui/material/TextareaAutosize';
|
||
|
|
import Button from '@mui/material/Button';
|
||
|
|
import * as React from 'react';
|
||
|
|
|
||
|
|
function LazyRoute() {
|
||
|
|
const [isDone, setIsDone] = React.useState(false);
|
||
|
|
|
||
|
|
if (!isDone) {
|
||
|
|
// Force React to show fallback suspense
|
||
|
|
throw new Promise((resolve) => {
|
||
|
|
setTimeout(resolve, 1);
|
||
|
|
setIsDone(true);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
return <div />;
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function TextareaAutosizeSuspense() {
|
||
|
|
const [showRoute, setShowRoute] = React.useState(false);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<React.Fragment>
|
||
|
|
<Button onClick={() => setShowRoute((r) => !r)}>Toggle view</Button>
|
||
|
|
<React.Suspense fallback={null}>
|
||
|
|
{showRoute ? <LazyRoute /> : <TextareaAutosize />}
|
||
|
|
</React.Suspense>
|
||
|
|
</React.Fragment>
|
||
|
|
);
|
||
|
|
}
|