prompt.md

prompt(id, options)

提示信息

参数	类型	描述
id	string	唯一标识
options	object	配置项
options.className	string	自定义类名
options.icon	string	图标
options.title	string	标题
options.text	string	文本
options.buttons	array	按钮
options.buttons[].text	string	按钮的文本
options.buttonClicked	function	按钮点击事件

Example

<import src="../../components/prompt/prompt.wxml"/>

<view class="page">
    <view class="page__bd">
        <view class="weui-tab">
            <view class="weui-navbar">
                <block wx:for-items="{{ tabs}}" wx:key="{{ index }}">
                    <view id="{{ index }}" class="weui-navbar__item {{ activeIndex == index ? 'weui-bar__item_on' : '' }}" bindtap="tabClick">
                        <view class="weui-navbar__title">{{ item }}</view>
                    </view>
                </block>
                <view class="weui-navbar__slider" style="left: {{ sliderLeft }}px; transform: translateX({{ sliderOffset }}px); -webkit-transform: translateX({{ sliderOffset }}px);"></view>
            </view>
            <view class="weui-tab__panel">
                <view class="weui-tab__content" hidden="{{ activeIndex != 0 }}">
                    <template is="prompt" data="{{ ...$wux.prompt.msg1 }}"/>
                </view>
                <view class="weui-tab__content" hidden="{{ activeIndex != 1 }}">
                    <template is="prompt" data="{{ ...$wux.prompt.msg2 }}"/>
                </view>
                <view class="weui-tab__content" hidden="{{ activeIndex != 2 }}">
                    <template is="prompt" data="{{ ...$wux.prompt.msg3 }}"/>
                </view>
            </view>
        </view>
    </view>
</view>

import { $wuxPrompt } from '../../components/wux'
const sliderWidth = 96

Page({  
    data: {
        tabs: ['全部', '待收货', '待评价'],
        activeIndex: '0',
        sliderOffset: 0,
        sliderLeft: 0
    },
    onLoad() {
        $wuxPrompt.init('msg1', {
            title: '空空如也', 
            text: '暂时没有相关数据', 
        }).show()

        $wuxPrompt.init('msg2', {
            icon: '../../assets/images/iconfont-order.png', 
            title: '您还没有相关的订单', 
            text: '可以去看看有哪些想买', 
            buttons: [
                {
                    text: '随便逛逛'
                }
            ],
            buttonClicked(index, item) {
                console.log(index, item)
            },
        }).show()

        $wuxPrompt.init('msg3', {
            icon: '../../assets/images/iconfont-empty.png', 
            title: '暂无待评价订单', 
        }).show()

        this.getSystemInfo()
    },
    getSystemInfo() {
        const that = this
        wx.getSystemInfo({
            success(res) {
                that.setData({
                    sliderLeft: (res.windowWidth / that.data.tabs.length - sliderWidth) / 2, 
                })
            }
        })
    },
    tabClick(e) {
        this.setData({
            sliderOffset: e.currentTarget.offsetLeft, 
            activeIndex: e.currentTarget.id, 
        })
    },
})