更新记录

1.2.2(2024-12-19)

panel类型增加设置图标的宽度、高度、圆角以及文本的字号大小参数

1.2.1(2024-12-18)

兼容在uniapp项目内使用

1.2(2024-09-23)

panel类型弹窗增加内容对齐方式属性gravity设置

查看更多

平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 4.36,Android:5.0,iOS:不支持,HarmonyNext:不确定 × × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
× × × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

xwq-toast 安卓全局消息弹窗插件

文档说明

注意啦,下载插件需要打包自定义基座才可正常使用

功能说明

  • 插件有两种类型可选toast|panel,可根据需要选择, panel类型可以覆盖原生导航,toast类型不行,调用参数可根据需要设置,非必要可不传:

  • panel类型调用方式:

    • 参数字段说明

      属性 类型 默认值 必填 描述
      type string toast N 弹窗类型
      content strig - N 提示框的内容
      position string top N 提示框的位置,支持top、bottom
      bgColor string - N 提示框的背景色,例如:"#ffff0000"
      textColor string - N 提示框的字体颜色,例如:"#ffff0000"
      textSize number 14 N 提示框的字体大小
      showApplicationIcon boolean false N 是否显示应用图标
      imgUrl string - N 自定义图片
      gravity string center N 提示内容的对齐方式,默认center,可选left、right
      imgRadius number 5 N 设置图标的圆角
      imgWidth number - N 设置图标的宽度,注意:如果设置过小会出现文本和图片不对齐的情况,可以通过设置gravity为center使其居中对齐
      imgHeight number - N 设置图标的高度,注意:如果设置过小会出现文本和图片不对齐的情况,可以通过设置gravity为center使其居中对齐
  • toast类型调用方式:

    • 参数字段说明

      属性 类型 默认值 必填 描述
      type string toast N 弹窗类型
      content strig - N 提示框的内容
      position string top N 提示框的位置,支持top、center、bottom
      bgColor string - N 提示框的背景色,例如:"#ffff0000"
      textColor string - N 提示框的字体颜色,例如:"#ffff0000"
  • 代码示例

  • uniapp调用方式

<template>
    <button type="primary" @click="openToast">打开Toast提示</button>
</template>

<script setup lang="ts">
    import { showToast } from '@/uni_modules/xwq-toast';
    import type {OptionType} from '@/uni_modules/xwq-toast';

    const openToast=()=>{
        let params={ 
            type:'panel',
            // position:'top',
            // showApplicationIcon:false,
            // textColor:"#00ff00",
            gravity:"left",
            imgUrl:"https://www.wanguoqiche.com/files/web/pic/jns/report_system_cold_img01.png?_vk=dPNGhM",
            content: "您的笔记已经审核222111" ,
        } as OptionType;
        showToast(params);
    };
</script>
  • uniappX调用方式
<template>
    <view>
        <button type="primary" @click="openToast">打开Toast提示</button>
    </view>
</template>

<script setup>
    import { showToast } from '@/uni_modules/xwq-toast';
    import type {OptionType} from '@/uni_modules/xwq-toast';

    const openToast=()=>{
        let params={ 
            type:'panel',
            // position:'top',
            // showApplicationIcon:false,
            // bgColor:"#ffff0000",
            // textColor:"#00ff00",
            content: "您的笔记已经审核通过您的笔记已经审核通过您的笔记已经审核通过" ,
        } as OptionType;
        showToast(params);
    };

</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问