Notistack 正在参加 2021 年度 OSC 中国开源项目评选,请投票支持!
Notistack 在 2021 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
2021 年度 OSC 中国开源项目评选 正在火热进行中,快来投票支持你喜欢的开源项目!
2021 年度 OSC 中国开源项目评选 >>> 中场回顾
Notistack 获得 2021 年度 OSC 中国开源项目评选「最佳人气项目」 !
授权协议 MIT
开发语言 JavaScript TypeScript
操作系统 跨平台
软件类型 开源软件
开源组织
地区 不详
投 递 者 罗奇奇
适用人群 未知
收录时间 2021-12-22

软件简介

Notstack 是一个通知库,使得网络应用程序上显示通知变得非常容易。它是高度可定制的,可以让通知框堆叠在彼此的顶部。

堆叠行为 达到 maxSnack 时关闭最旧的(此处设置为 3)

如何使用

1:将应用程序包装在 SnackbarProvider 组件中:(有关可用道具的完整列表,请参阅API 参考)

注意:如果使用的是 material-ui ThemeProvider,请确保 SnackbarProvider 是它的子项。

import { SnackbarProvider } from 'notistack';

<SnackbarProvider>
    <MyApp />
</SnackbarProvider>

2:使用 withSnackbar 导出任何需要发送通知的组件。这样做可以访问两种方法 enqueueSnackbar 和closeSnackbar,前者可用于发送 snackbar。

import { withSnackbar } from 'notistack';

class MyComponent extends Component {
    handleConnectionLoss = () => {
        this.key = this.props.enqueueSnackbar('You're offline.');
    };

    handleBackOnline = () => {
        this.props.closeSnackbar(this.key);
    };

    render() {
        //...
    };
}

export default withSnackbar(MyComponent);

2(替代):也可以在功能组件中使用 useSnackbar hook。

import { useSnackbar } from 'notistack';

const MyButton = () => {
    const { enqueueSnackbar, closeSnackbar } = useSnackbar();

    const handleClick = () => {
        enqueueSnackbar('I love hooks');
    };

    return (
        <Button onClick={handleClick}>Show snackbar</Button>
    );
}

enqueueSnackbar:将 snackbar 添加到要显示给用户的队列中。它接受两个参数消息和一个选项对象,并返回一个键,用于稍后引用该 snackbar(例如以编程方式关闭它)。

const key = this.props.enqueueSnackbar(message, options)

closeSnackbar:使用给定的键关闭 snackbar,可以通过不向此功能传递键来立即关闭所有 snackbar。

// dismiss all open snackbars
this.props.closeSnackbar()

// dismiss a specific snackbar
this.props.closeSnackbar(key)

 

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论

点击引领话题📣
暂无内容
发表了博客
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
发表了问答
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
lodash输入验证错误漏洞
原型污染
lodash是一款开源的JavaScript实用程序库。 lodash 4.17.15及之前版本中存在输入验证错误漏洞。远程攻击者可借助'merge'、'mergeWith'和'defaultsDeep'函数利用该漏洞在系统上执行任意代码。
CVE-2020-8203 MPS-2020-15679
2022-08-08 19:01
Ajv 输入验证错误漏洞
输入验证不恰当
Ajv 6.12.2版本中的ajv.validate()函数中存在输入验证错误漏洞。攻击者可利用该漏洞执行代码或造成拒绝服务。
CVE-2020-15366 MPS-2020-10525
2022-08-08 19:01
jQuery 跨站脚本漏洞
XSS
在大于或等于 1.0.3 和 3.5.0 之前的 jQuery 版本中,传递的 HTML 包含<option>来自不受信任来源的元素(即使在对其进行清理之后)到 jQuery 的 DOM 操作方法之一(即 .html()、.append() 等)可能会执行不受信任的代码。这个问题在 jQuery 3.5.0 中得到了修复。
CVE-2020-11023 MPS-2020-15461
2022-08-08 19:01
jQuery 跨站脚本漏洞
XSS
在大于或等于 1.2 和 3.5.0 之前的 jQuery 版本中,将来自不受信任来源的 HTML(即使在对其进行清理之后)传递给 jQuery 的 DOM 操作方法之一(即 .html()、.append() 等)可能会执行不受信任的代码。这个问题在 jQuery 3.5.0 中得到了修复。
CVE-2020-11022 MPS-2020-15462
2022-08-08 19:01
shelljs 安全漏洞
特权管理不恰当
shelljs是基于Node.js API 的 Unix shell 命令的可移植(Windows/Linux/OS X)实现。 shelljs存在安全漏洞,该漏洞源于不适当的权限管理,攻击者可利用该漏洞进行越权访问。
CVE-2022-0144 MPS-2022-0508
2022-08-08 19:01
lodash 存在拒绝服务漏洞
拒绝服务
lodash 是一个现代 JavaScript 实用程序库,提供模块化、性能和附加功能。由于对 CVE-2020-8203 的修复不完整,此软件包的受影响版本容易受到 zipObjectDeep 中的原型污染。
MPS-2022-13841
2022-08-08 19:01
uglify-js 存在ReDoS漏洞
ReDoS
uglify-js 是一个 JavaScript 解析器、压缩器、压缩器和美化工具包。此软件包的受影响版本容易通过 string_template 和 decode_template 函数受到正则表达式拒绝服务 (ReDoS) 的攻击。
MPS-2022-14112
2022-08-08 19:01
mixin-deep 参数注入漏洞
参数注入或修改
mixin-deep是一款能够将对象属性混合到第一个对象中的模块。 mixin-deep 1.3.2之前版本和2.0.0版本中存在参数注入漏洞。该漏洞源于外部输入数据构造命令参数的过程中,网络系统或产品未正确过滤参数中的特殊字符。攻击者可利用该漏洞执行非法命令。
CVE-2019-10746 MPS-2019-10507
2022-08-08 19:01
handlebars 安全漏洞
原型污染
handlebars是一款语义化的Web模板系统。 handlebars 4.7.7之前版本存在安全漏洞,该漏洞源于当选择某些编译选项来编译来自不可信源的模板时,容易受到原型污染的影响。
CVE-2021-23383 MPS-2021-6180
2022-08-08 19:01
github ws 资源管理错误漏洞
github ws是一个应用软件。一种易于使用,运行迅速且经过全面测试的WebSocket客户端和服务器实现的方法。 漏洞版本中“Sec-Websocket-Protocol”标头的一个特殊的值可以用来显著降低ws服务器的速度,从而导致拒绝服务漏洞。
CVE-2021-32640 MPS-2021-7109
2022-08-08 19:01
lodash 命令注入漏洞
代码注入
lodash是一个提供模块化、性能和附加功能的现代 JavaScript 实用程序库。 4.17.21 之前的 Lodash 版本容易通过模板函数进行命令注入。
CVE-2021-23337 MPS-2021-2638
2022-08-08 19:01
Npm underscore 代码注入漏洞
代码注入
Underscore.js 是一个用于 JavaScript 的实用工具带库,它为常见的功提供支持,而无需扩展任何核心 JavaScript 对象。 漏洞版本中存在代码注入漏洞,攻击者可利用该漏洞容易通过模板函数执行任意代码。
CVE-2021-23358 MPS-2021-3658
2022-08-08 19:01
handlebars 安全漏洞
handlebars是一款语义化的Web模板系统。 handlebars 4.7.7版本之前存在安全漏洞,该漏洞源于在选择某些编译选项来编译来自不受信任的源的模板时,handlebars容易受到远程代码执行(Remote Code Execution, RCE)的攻击。
CVE-2021-23369 MPS-2021-4548
2022-08-08 19:01
istanbul-reports 存在通过 window.opener 访问使用指向不受信任目标的 Web 链接漏洞
通过 window.opener 访问使用指向不受信任目标的 Web 链接
由于指向 https://istanbul 的链接中没有 rel 属性,因此该软件包的受影响版本容易受到反向 Tabnabbing 的攻击。
MPS-2022-13797
2022-08-08 19:01
marked 存在ReDoS漏洞
ReDoS
标记是一个低级编译器,用于解析降价而不需要长时间缓存或阻塞。此软件包的受影响版本容易受到正则表达式拒绝服务 (ReDoS) 的攻击。
MPS-2022-13864
2022-08-08 19:01
Yargs Y18n 输入验证错误漏洞
动态确定对象属性修改的控制不恰当
Yargs Y18n是Yargs个人开发者的一个类似I18n的由Js编写的代码库。 y18n before 3.2.2, 4.0.1 and 5.0.5版本存在输入验证错误漏洞,该漏洞源于网络系统或产品未对输入的数据进行正确的验证。
CVE-2020-7774 MPS-2020-17543
2022-08-08 19:01
Mikaelbr Node-notifier 操作系统命令注入漏洞
命令注入
Mikaelbr Node-notifier是Mikaelbr个人开发者的一个基于Javascript的用于为Mac、Windows、Linux发送统治的代码库。 node-notifier 9.0.0之前版本存在安全漏洞,该漏洞允许攻击者可利用该漏洞在Linux机器上运行任意命令,因为在传递数组时,选项参数没有被清除。
CVE-2020-7789 MPS-2020-17637
2022-08-08 19:01
minimist 输入验证错误漏洞
原型污染
minimist是一款命令行参数解析工具。 minimist 1.2.2之前版本存在输入验证错误漏洞。攻击者可借助‘constructor’和‘__proto__’ payload利用该漏洞添加或修改Object.prototype的属性。
CVE-2020-7598 MPS-2020-3516
2022-08-08 19:01
nodejs 资源管理错误漏洞
拒绝服务
nodejs是是一个基于ChromeV8引擎的JavaScript运行环境通过对Chromev8引擎进行了封装以及使用事件驱动和非阻塞IO的应用让Javascript开发高性能的后台应用成为了可能。 nodejs-glob-parent 存在安全漏洞,该漏洞源于正则表达式拒绝服务。
CVE-2020-28469 MPS-2021-7827
2022-08-08 19:01
highlight.js 存在拒绝服务漏洞
拒绝服务
highlight.js 是一个用 JavaScript 编写的语法荧光笔。它可以在浏览器和服务器上工作。它几乎适用于任何标记,不依赖于任何框架,并且具有自动语言检测功能。此软件包的受影响版本容易受到正则表达式拒绝服务 (ReDoS) 的攻击,这些攻击通过多语言突出显示中的指数和多项式灾难性回溯进行。
MPS-2022-13759
2022-08-08 19:01
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
0 评论
2 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部