---
title: 消息通知组件
order: 1
docGenIncludes:
  - src/components/YwNotice/index.tsx
---



```jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { YwNotice } from '@ywfe/yw-design';

const App = () => {
    return (
      <div>
       <h3>消息类型样式</h3>
        <YwNotice content={'content'} title = 'Success' type='success' />
        <YwNotice content={'content'} title = 'Warning'  type='warning'/>
        <YwNotice content={'content'} title = 'Error'  type='error'/>
        <YwNotice content={'content'} title = 'Notice'  type='notice'/>
        <YwNotice content={'content'} title = 'Help'  type='help'/>
        <h3>单行样式</h3>
        <YwNotice title={'Success'}  type='success' />
        <h3>多条内容样式</h3>
        <YwNotice content={['content1','content2','content3','content4']}  type='help'/>
        <h3>按钮样式</h3>
         <YwNotice content={'content'} title = 'Success' type='success' btnText='不再提醒' onClick={()=>{}}/>
        <h3>可关闭</h3>
         <YwNotice content={'content'} title = 'Success' type='success' closeable onClose={()=>{}}/>
      </div>
    );
}

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