Alert 警告框

    1. <view class="page">
    2.     <view class="page__hd">
    3.         <view class="page__title">Alert</view>
    4.         <view class="page__desc">警告框</view>
    5.     </view>
    6.     <view class="page__bd page__bd_spacing">
    7.         <view class="sub-title">Theme</view>
    8.         <wux-alert theme="light" title="https://github.com/wux-weapp/wux-weapp" />
    9.         <wux-white-space />
    10.         <wux-alert theme="stable" title="https://github.com/wux-weapp/wux-weapp" />
    11.         <wux-white-space />
    12.         <wux-alert theme="positive" title="https://github.com/wux-weapp/wux-weapp" />
    13.         <wux-alert theme="calm" title="https://github.com/wux-weapp/wux-weapp" />
    15.         <wux-alert theme="assertive" title="https://github.com/wux-weapp/wux-weapp" />
    16.         <wux-white-space />
    17.         <wux-alert theme="balanced" title="https://github.com/wux-weapp/wux-weapp" />
    18.         <wux-white-space />
    19.         <wux-alert theme="energized" title="https://github.com/wux-weapp/wux-weapp" />
    20.         <wux-white-space />
    21.         <wux-alert theme="royal" title="https://github.com/wux-weapp/wux-weapp" />
    22.         <wux-white-space />
    23.         <wux-alert theme="dark" title="https://github.com/wux-weapp/wux-weapp" />
    24.         <view class="sub-title">Closable</view>
    25.         <wux-alert closable title="微信小程序自定义组件" label="https://github.com/wux-weapp/wux-weapp" />
    26.         <wux-white-space />
    27.         <wux-alert closable title="微信小程序自定义组件" label="https://github.com/wux-weapp/wux-weapp" />
    28.         <wux-white-space />
    29.         <wux-alert closable title="微信小程序自定义组件" label="https://github.com/wux-weapp/wux-weapp" />
    30.         <view class="sub-title">Thumb</view>
    31.         <wux-alert thumb="https://wux.cdn.cloverstd.com/logo.png" label="https://github.com/wux-weapp/wux-weapp" />
    32.         <wux-white-space />
    33.         <wux-white-space />
    34.         <wux-alert thumb="https://wux.cdn.cloverstd.com/logo.png" label="https://github.com/wux-weapp/wux-weapp" />
    35.         <view class="sub-title">Slot</view>
    37.             <wux-icon wux-class="thumb" type="ios-checkmark-circle-outline" size="20" color="#fff" slot="header" />
    38.             <text>微信小程序自定义组件</text>
    39.             <wux-icon wux-class="close" type="ios-close-circle-outline" size="20" color="#fff" slot="footer" />
    40.         </wux-alert>
    41.         <wux-white-space />
    42.         <wux-alert theme="energized">
    43.             <wux-icon wux-class="thumb" type="ios-alert" size="20" color="#fff" slot="header" />
    44.             <text>微信小程序自定义组件</text>
    45.         </wux-alert>
    46.         <wux-white-space />
    47.         <wux-alert theme="assertive">
    48.             <wux-icon wux-class="thumb" type="ios-close-circle-outline" size="20" color="#fff" slot="header" />
    49.             <text>微信小程序自定义组件</text>
    50.         </wux-alert>
    51.     </view>
    52. </view>

    Alert