1.0.1 • Published 8 months ago

wil-toast v1.0.1

Weekly downloads
-
License
ISC
Repository
-
Last release
8 months ago

wil-toast

通用toast组件。

Demo示例
前往Gitee

安装

方式一：通过import方式引入

npm install wil-toast
import toast from 'wil-toast';
toast.show('网络出错了！');

方式二：内联html文件

npm install wil-toast
# 安装 raw-loader，要求版本号为 0.5.1 版本
npm install raw-loader@0.5.1

在 html 文件内使用 \<script> 标签内联引入

<script><%=require('raw-loader!wil-toast/dist/toast.min.js')%></script>
<script>
  toast.show('网络出错了！');
</script>

由于此组件使用了document.body方法，所以必须在\<body>标签内引用此组件，否则会出现报错;，使用此方式引入组件。必须在最靠近 <body> 标签的位置使用 <script> 标签引入。

使用方式

/* 显示，1秒后隐藏，默认0.5秒 */
toast.show('hello', 1000);
/* 修改toast样式 */
toast.show('hello', 1000, { size: 20 });
/* 修改toast样式，支持不填写时间，默认0.5秒 */
toast.show('hello', {
  size: 40,
  color: 'white',
  background: 'green'
})

API

toast.show(content[, showTime, styleSet]);

属性类型默认值是否必填说明
contentString无是toast显示的文本
showTimeNumber500否toast持续时间
styleSetObject无否toast消失之前采用的样式，具体设置项查看下方styelSet

styleSet 支持属性如下

属性类型默认值是否必填说明
colorString无否toast字体颜色
sizeNumber无否toast字体大小，注意：不要带px单位，否则会导致字体设置失效！
backgroundString无否toast背景，与size一样，传入的即为background属性的值。
@everything-registry/sub-chunk-3147
1.0.1

8 months ago