Snackbar
2018-05-26 03:22 更新
Snackbar 会在窗口下方出现一个小的弹出框，它们可以在超时或用户触摸屏幕其他地方后自动消失。
屏幕上最多只能同时显示一个 Snackbar，如果在 Snackbar 还未关闭时就打开下一个 Snackbar，则下一个 Snackbar 会被加入队列，等当前 Snackbar 关闭后再打开。
调用方式
调用方法 mdui.snackbar(params) 即可。
相关资料
Material Design Snackbars & toasts 设计规范
使用方法
Snackbar 直接由 JavaScript 调用，无需编写 HTML 布局。
要想创建一个 Snackbar，只需调用方法 mdui.snackbar(params)，该方法返回 Snackbar 的实例。
创建 Snackbar 所需的参数：
| 参数名 | 类型 | 默认值 | 说明 |
| message | string | Snackbar 的文本，该参数不能为空。 | |
| timeout | int | 4000 | 在用户没有操作时多长时间自动隐藏，单位（毫秒）。 |
| buttonText | string | 按钮的文本。 | |
| buttonColor | string | #90CAF9 | 按钮的文本颜色，可以是颜色名或颜色值，如 red、#ffffff、rgba(255, 255, 255, 0.3) 等。 |
| closeOnButtonClick | boolean | true | 点击按钮时是否关闭 Snackbar。 |
| closeOnOutsideClick | boolean | true | 点击或触摸 Snackbar 以外的区域时是否关闭 Snackbar。 |
| onClick | function | 在 Snackbar 上点击的回调函数。 | |
| onButtonClick | function | 点击 Snackbar 上的按钮时的回调函数。 | |
| onClose | function | Snackbar 开始关闭时的回调函数。 |
Snackbar 实例拥有的方法：
| 方法名 | 描述 |
| close | 关闭 Snackbar，关闭后 Snackbar 会被销毁。 |
示例
以上内容是否对您有帮助：
← 工具提示
更多建议：