Rockydonthurtem
10/10/2018 - 5:26 PM

Modals

Modals

```style={{
              display: this.state.open ? 'block' : 'none',
              background: 'salmon',
              height: '100vh',
              width: '100vw',
              position: 'absolute',
              top: '0',
              left: '0'
            }}```
```import React, { Component } from 'react';
------------------------------------------------------------------------------------------------------------
import Dummy from './Dummy';
import ErrorBoundary from './ErrorBoundary';
import Modal from './Modal';

import './App.css';

class App extends Component {
  state = { open: false };
  render() {
    return (
      <ErrorBoundary>
        <div className="App">
          <Dummy />
          <button onClick={() => this.setState({ open: true })}>
            Open Modal
          </button>
        </div>
        <Modal>
          <div
            style={{
              display: this.state.open ? 'block' : 'none',
              background: 'salmon',
              height: '100vh',
              width: '100vw',
              position: 'absolute',
              top: '0',
              left: '0'
            }}
          >
            Hello from Modal
            <button onClick={() => this.setState({ open: false })}>
              Close
            </button>
          </div>
        </Modal>
      </ErrorBoundary>
    );
  }
}

export default App;```