# message

## 案例演示

### message 基本用法

---demo
```js
import { Button, message, FlashNotice } from 'amos-framework';

class Demo extends Component {
  state = {
    showFlashNotice: false
  };
  render() {
    return (
      <div className="btn-demo">
        <Button onClick={() => message.success('操作成功')}>成功</Button>
        <Button onClick={() => message.danger('操作失败')}>失败</Button>
        <Button onClick={() => message.danger('操作失败,15s后自动关闭，或手动关闭', 1500, true)}>失败(showClose)</Button>
        <Button onClick={() => message.danger('操作失败', 0)}>手动关闭</Button>
        <Button onClick={() => message.info('info 失败')}>info</Button>
        <Button onClick={() => message.custom('alarm-tip','报警')}>customIcon</Button>
        <Button onClick={() => this.setState({ showFlashNotice: true })}>显示FlashNotice</Button>
        <FlashNotice
          content="我是警告信息，点击我将消失。"
          visible={this.state.showFlashNotice}
          destroy={(visible) => this.setState({ showFlashNotice: visible })}
        />
      </div>
    );
  }
}

ReactDOM.render(<Demo />, _react_runner_);
```
---demoend

## Method

* 使用方式

```js
// success、danger、error、info
message.success('成功!');
message.success('成功!', 5);

// custom
message.success('自定义', 'icon');
message.success('自定义', 'icon', 5);

close();
```

### success(message, duration, showClose)

成功信息

* `message`: string | element 内容，支持 React 元素
* `duration`: number 可选，持续时间，单位秒，为0时手动关闭， 默认 2 秒后自动关闭
* `showClose`: boolean 可选，是否显示手动关闭按钮，当 `duration === 0` 时，强制显示关闭按钮

### danger 同 error

`danger(message, duration, showClose)`

失败信息

* `message`: string | element 内容，支持 React 元素
* `duration`: number 可选，持续时间，单位秒，为0时手动关闭， 默认 3 秒后自动关闭
* `showClose`: boolean 可选，是否显示手动关闭按钮，当 `duration === 0` 时，强制显示关闭按钮

### info(message, duration, showClose)

通用信息

* `message`: string | element 内容，支持 React 元素
* `duration`: number 可选，持续时间，单位秒，为0时手动关闭， 默认 4 秒后自动关闭
* `showClose`: boolean 可选，是否显示手动关闭按钮，当 `duration === 0` 时，强制显示关闭按钮

### custom(customIcon, message, duration, showClose)

自定义信息

* `customIcon`: string 自定义图标, amos-icon。 可以为 `''、undefined、false、null`，则表示不显示图标
* `message`: string | element 内容，支持 React 元素
* `duration`: number 可选，持续时间，单位秒，为0时手动关闭， 默认 4 秒后自动关闭
* `showClose`: boolean 可选，是否显示手动关闭按钮，当 `duration === 0` 时，强制显示关闭按钮

### close()

关闭当前 message

## 扩展

`FlashNotice`

props:

* content: PropTypes.string, // 内容
* visible: PropTypes.bool, // 是否显示
* destroy: PropTypes.func // 销毁时的回调方法

```js
import { FlashNotice } from 'amos-framework';

<FlashNotice
  content="我是警告信息，点击我将消失。"
  visible={this.state.showFlashNotice}
  destroy={(visible) => this.setState({ showFlashNotice: visible })}
/>
```