Модальный компонент изact-materialize перестает работать после обновления состояния.
Вот мои зависимости от моего пакета. json
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"materialize-css": "^1.0.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-materialize": "^3.8.3",
"react-scripts": "3.4.1"
}
И фрагмент кода для воспроизведения проблемы
import React, {useState} from 'react';
import './App.css';
import 'materialize-css/dist/css/materialize.min.css'
import 'materialize-css'
import {Button, Modal} from 'react-materialize'
function App() {
const [text, setText] = useState('INITIAL')
function changeText(){
setText('AFTER')
}
return (
<div className="App">
<p>{text}</p>
<Button onClick={changeText}>CLICK ME</Button>
<Modal
header='Modal Header'
trigger={<Button>MODAL</Button>}>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
</Modal>
</div>
);
}
export default App;
После обновления страницы, если я нажимаю кнопку MODAL, отображается модал, но если я сначала нажимаю кнопку CLICK ME, а затем нажимаю MODAL, ничего не отображается.
Кто-нибудь знает способ решить эту проблему?