## OPButton 按钮组件

·API

| 参数     | 说明                                                      | 类型     | 默认值   |
| -------- | --------------------------------------------------------- | -------- | -------- |
| type     | 类型 可选值 normal、secondary、error、primary、link、text | String   | normal   |
| size     | 大小 可选值 small、medium                                 | String   | medium   |
| hotkey   | hotkey                                                    | String   | -        |
| disabled | 是否禁用                                                  | Boolean  | false    |
| loading  | 设置按钮的 loading 状态                                   | Boolean  | false    |
| onClick  | 点击按钮的回调                                            | Function | ()=>void |

```jsx
import React, { Component, createRef } from 'react';
import ReactDOM from 'react-dom';
import { OPButton } from '../src/view';
import { Icon } from '@alife/cn-ui';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      disabled: false,
      loading: false,
      mDisabled: false,
      mLoading: false,
    };
  }
  render() {
    const { disabled, loading, mDisabled, mLoading } = this.state;
    return (
      <div style={{ position: 'relative' }}>
        <div style={{ marginBottom: '8px' }}>small，点击设置loading</div>
        <div style={{ marginBottom: '12px' }}>
          <OPButton
            hotkey='Esc'
            type='normal'
            size='small'
            loading={loading}
            onClick={() => this.setState({ loading: !loading })}
          >
            取消
          </OPButton>
          <OPButton
            hotkey='Esc'
            type='secondary'
            loading={loading}
            size='small'
            onClick={() => this.setState({ loading: !loading })}
          >
            取消
          </OPButton>
          <OPButton
            hotkey='Esc'
            type='error'
            size='small'
            loading={loading}
            onClick={() => this.setState({ loading: !loading })}
          >
            清空
          </OPButton>
          <OPButton
            hotkey='Esc'
            type='primary'
            size='small'
            loading={loading}
            onClick={() => this.setState({ loading: !loading })}
          >
            确认异常
          </OPButton>
          <OPButton
            hotkey='Esc'
            size='small'
            loading={loading}
            onClick={() => this.setState({ loading: !loading })}
            balloon={{
              children: '对此按钮功能的解释',
            }}
          >
            悬浮提示
          </OPButton>
        </div>
        <div style={{ marginBottom: '8px' }}>medium，点击设置disabled</div>
        <div>
          <OPButton
            hotkey='Esc'
            type='normal'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
          >
            取消
          </OPButton>
          <OPButton
            hotkey='Esc'
            type='secondary'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
          >
            取消
          </OPButton>
          <OPButton
            hotkey='Esc'
            type='error'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
          >
            清空
          </OPButton>
          <OPButton
            hotkey='Enter'
            type='primary'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
          >
            确认异常
          </OPButton>
          <OPButton
            type='link'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
          >
            更换
          </OPButton>
          <OPButton
            type='text'
            disabled={disabled}
            onClick={() => this.setState({ disabled: !disabled })}
            hotkey='F1'
          >
            扫描商品查看进度
          </OPButton>
        </div>
      </div>
    );
  }
}

ReactDOM.render(<App />, mountNode);
```

```css
body {
  overflow: auto;
}
```