Toast 轻提示


提供一个简单的 Toast,可以传入 iconimage 来展示不同的效果,另外提供日常使用频繁的三种状态来快速实现效果,页面层级为1090

使用指南

在 Taro 文件中引入组件

  1. import { AtToast } from "taro-ui"

组件依赖的样式文件(仅按需引用时需要)

  1. @import "~taro-ui/dist/style/components/toast.scss";
    @import "~taro-ui/dist/style/components/icon.scss";

一般用法

  1. <AtToast isOpened text="{text}" icon="{icon}"></AtToast>

AtToast 参数

参数说明类型可选值默认值
text元素的内容String--
iconicon 的类型String--
image元素展示的图片String--
status元素的状态Stringerror, loading, success-
isOpened是否展示元素Boolean-false
duration元素持续的事件(设置为 0 将不会自动消失)Number-3000
hasMask是否存在底部遮罩层(无法点击底部的内容区)Boolean--

AtToast 事件

事件名称说明返回参数
onClick元素被点击之后触发的事件-
onClose元素被关闭之后触发的事件-

Toast轻提示 - 图1