关于useState useEffect

2019-10-16  本文已影响0人  码萌

import React, { useState, useEffect } from 'react'
import PropTypes from 'prop-types'
import _ from 'lodash'
import CX from 'classnames'

import './index.less'

function WindowOperaButtonsForMac(props) {
  const { style, enableResize } = props
  const {
    WindowStateAction, listenToWindowStateChange, getWindowState, WINDOW_STATE,
  } = require('~/shared/utils/windowState')
  const currentWindow = require('electron').remote.getCurrentWindow()
  const [isMaximized, setIsMaximized] = useState(currentWindow.isMaximized())

  const wrapperStyle = _.assign({}, style)

  const handleMaximize = () => {
    setIsMaximized(currentWindow.isMaximized())
  }

  useEffect(() => {
    return listenToWindowStateChange(handleMaximize)
  })

  return (
    <div className="window-opera-buttons-for-mac-component-wrap" style={wrapperStyle}>
      <span
        className="btn btn-close"
        onClick={() => {
          WindowStateAction.close()
        }}
        role="button"
        tabIndex={0}
      />
      <span
        className="btn btn-minimize"
        onClick={() => {
          WindowStateAction.minimize()
        }}
        role="button"
        tabIndex={0}
      />
      <span
        className={CX({
          btn: true,
          'btn-maximize': isMaximized === false,
          'btn-unmaximize': isMaximized === true,
          'btn-maximize-disabled': enableResize === false,
        })}
        onClick={() => {
          if (enableResize === false) {
            return
          }
          const state = getWindowState(currentWindow)
          if (state === WINDOW_STATE.MAXIMIZED) {
            WindowStateAction.unmaximize()
          } else if (state === WINDOW_STATE.NORMAL) {
            WindowStateAction.maximize()
          }
        }}
        role="button"
        tabIndex={0}
      />
    </div>
  )
}

WindowOperaButtonsForMac.propTypes = {
  style: PropTypes.object,
  enableResize: PropTypes.bool,
}

WindowOperaButtonsForMac.defaultProps = {
  style: {},
  enableResize: false,
}

export default WindowOperaButtonsForMac

上一篇下一篇

猜你喜欢

热点阅读