У меня проблемы с использованием компонента Collapse в качестве моего TransitionComponent для Material-UI.
Мало того, что он не работает, он также ломает якорь.
Fade работает нормально, неуверен, где искать ответы.
Заранее спасибо.
Ссылка на коды andbox
import React, { useState, useRef } from "react";
import ReactDOM from "react-dom";
import { Menu, MenuItem, Collapse, Fade, Typography } from "@material-ui/core";
function App() {
const [open, toggle] = useState(false);
const ref = useRef(null);
return (
<>
<div style={{ position: "absolute", top: "50%" }} ref={ref}>
<Typography variant="h4" className="App" onClick={() => toggle(true)}>
Click me!
</Typography>
</div>
<Menu
TransitionComponent={Collapse}
anchorEl={ref.current}
open={open}
onClose={() => toggle(false)}
>
<MenuItem>Item do menu</MenuItem>
</Menu>
<Menu
TransitionComponent={Fade}
transitionDuration={800}
anchorEl={ref.current}
open={open}
onClose={() => toggle(false)}
>
<MenuItem>Item do menu</MenuItem>
</Menu>
</>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);