uni-app: 交互反馈的例子(hbuilderx 3.6.18)

一，官方文档地址:

https://uniapp.dcloud.net.cn/api/ui/prompt.html#showtoast

如图:

二，演示代码

<template>
    <view>
        <button style="width: 600rpx;margin-top: 30rpx;" type="primary" @click="showTip">显示提示信息</button>
        
        <button style="width: 600rpx;margin-top: 30rpx;" type="default" @click="showLoad">显示加载框</button>
        
        <button style="width: 600rpx;margin-top: 30rpx;" type="warn" @click="showDialog">显示对话框</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                
            }
        },
        methods: {
            //显示对话框
            showDialog:function(){
                uni.showModal({
                    title: '提示',
                    content: '这是一个模态弹窗',
                    success: function (res) {
                        if (res.confirm) {
                            console.log('用户点击确定');
                        } else if (res.cancel) {
                            console.log('用户点击取消');
                        }
                    }
                });
            },
            //显示tip
            showTip:function() {
                    uni.showToast({
                                        icon:'success',
                                        title:"已更新数据",
                                        duration: 2000,
                                        position:'top',
                                    });
            },
            //显示loading
            showLoad:function(){
                uni.showLoading({
                    title: '加载中'
                });
                setTimeout(function () {
                    uni.hideLoading();
                }, 2000);
            },
        }
    }
</script>

<style>

</style>