欢迎光临
我们一直在努力

九八云小程序教程:微信小程序 WeUI·确认页样式

Msg

Msg组件提供操作确认页或操作成功或失败的标准的确认页的样式。

示例代码:

{
  "usingComponents": {
    "mp-msg": "../components/msg/msg"
  },
  "navigationBarTitleText": "UI组件库"
}
<view class="page">
    <mp-msg type="success" title="操作成功">
        <view slot="desc">内容详情,可根据实际需要安排,如果换行则不超过规定长度,居中展现<navigator url="" class="weui-msg__link">文字链接</navigator></view>
        <view slot="extend">
            <view>1. 说明1</view>
            <view>2. 说明2</view>
        </view>
        <view slot="handle">
            <button class="weui-btn" type="primary">主要操作</button>
            <button class="weui-btn" type="default">辅助操作</button>
        </view>
        <view slot="footer">
            <view class="weui-footer__links">
                <navigator url="" class="weui-footer__link">底部链接文本</navigator>
            </view>
            <view class="weui-footer__text">Copyright © 2008-2016 weui.io</view>
        </view>
    </mp-msg> 
</view>


属性列表

属性 类型 默认值 必填 说明
ext-class string 添加在组件内部结构的class,可用于修改组件内部的样式
type string 顶部图标的样式,和icon组件的type属性用法一样
size number 64 type不为空的时候有效,和icon组件的size属性用法一样
icon string type为空的时候,icon的值是顶部图标的路径
title string 标题
desc string 描述内容,和desc的slot显示在相同的位置

Slot

名称 描述
desc 描述内容slot
extend desc下面的说明区域的slot
handle 操作按钮区域slot
footer 底部slot

赞(0) 打赏
未经允许不得转载:九八云安全 » 九八云小程序教程:微信小程序 WeUI·确认页样式

评论 抢沙发