diff --git a/README.md b/README.md index fd01daa7..baba74b4 100644 --- a/README.md +++ b/README.md @@ -53,46 +53,35 @@ const customStyles = { // Make sure to bind modal to your appElement (http://reactcommunity.org/react-modal/accessibility/) Modal.setAppElement('#yourAppElement') -class App extends React.Component { - constructor() { - super(); - - this.state = { - modalIsOpen: false - }; - - this.openModal = this.openModal.bind(this); - this.afterOpenModal = this.afterOpenModal.bind(this); - this.closeModal = this.closeModal.bind(this); +function App(){ + var subtitle; + const [modalIsOpen,setIsOpen] = React.useState(false); + function openModal() { + setIsOpen(true); } - openModal() { - this.setState({modalIsOpen: true}); - } - - afterOpenModal() { + function afterOpenModal() { // references are now sync'd and can be accessed. - this.subtitle.style.color = '#f00'; + subtitle.style.color = '#f00'; } - closeModal() { - this.setState({modalIsOpen: false}); + function closeModal(){ + setIsOpen(false); } - render() { return (
- + -

this.subtitle = subtitle}>Hello

- +

(subtitle = _subtitle)}>Hello

+
I am a modal
@@ -104,7 +93,6 @@ class App extends React.Component {
); - } } ReactDOM.render(, appElement);