仓储管理 MDB Pro component

存储管理-Bootstrap 5和Material Design 2.0插件

存储组件使您可以管理存储在浏览器内存中的数据。感谢 组件,您可以轻松地添加,删除,获取数据并检查其过期时间。

注意:阅读 API 标签以找到所有可用选项,然后 高级定制


基本例子

存储组件提供添加,删除和获取存储的方法。

设置存储

使用方法 Storage.set()将数据添加到存储中。您可以测试此方法 使用以下示例。该按钮将调用 Storage.set('date',new Date()); 。要再次使用此示例,请按重置 按钮。

设置到期时间

您可以设置本地存储中已保存数据的到期时间(以天为单位)

获取存储空间

如果您已将任何数据保存在存储器中,则可以使用 Storage.get 方法。

删除存储

当不再需要保存在存储器中的数据并且想要删除它们时,请使用 Storage.remove 方法。

检查存储

您可以设置任务以检查数据是否已过期,删除数据并设置回调函数。 设置数据名称,间隔 interval (以分钟为单位),以检查频率 到期日期和回调fn


进阶范例

为新用户显示模式

使用 showModalNewUser 方法,您可以显示新用户的模式。 单击开始按钮以开始模拟此行为。下次单击模态后不显示任何 直到您单击重置。

下次访问后显示模态

如果您想向再次访问该页面的人显示模式,则可以使用 showModalScoring 方法。输入参数后的信息 多次访问该网站应该会出现该模式。单击开始按钮3次以对此进行测试 特征。

仓储管理 - API


用法

通过JavaScript


        Storage.set('date', new Date(), 1);
      

方法

Name Description Example
set Add new data to local storage Storage.set( ... )
get Get data from local storage Storage.get( ... )
remove Remove data from local storage Storage.remove( ... )
check Check the data has not expired Storage.check( ... )

        Storage.set('name', 'value', 1);
      

进口

MDB UI KIT 也可与模块捆绑器一起使用。使用以下代码导入 此组件:


        import { Storage } from 'mdb-ui-kit';