基于vuetify封装消息提示插件制造技术

本发明专利技术涉及一种基于vuetify封装消息提示插件，在渐进式框架中使用vuetify来编写消息提示的组件，将组件导入到页面逻辑文件中进行插件的开发，然后在项目的入口文件中引入开发的插件，通过全局方法将引入的插件进行注册，最后在模板内直接调用注册好的插件，这样同时提供了丰富的样式传参以及方法，可以满足开发者的所有需求，不但可以提高用户的使用体验，也可以大大的提高开发者的开发效率。也可以大大的提高开发者的开发效率。也可以大大的提高开发者的开发效率。

【技术实现步骤摘要】
基于vuetify封装消息提示插件


[0001]本专利技术涉及前端开发领域，特别是是一种以vue为基础框架，使用Web技术构建的通用、可重用、可自定义的页面通知弹窗插件。

技术介绍

[0002]随着互联网的快速发展，前端技术也随之飞速发展，各种各样的需求层出不穷，页面的逻辑也变的越来越复杂，为了提高用户的使用体验，消息提示也成了不可或缺的一部分。
[0003]Vuetify是建立在Vue.js之上的完备的界面框架。该项目的目标是向开发人员提供他们积累的丰富且吸引用户体验所需的工具。与其他框架不同。Vuetify从一开始就设计为易于学习的并且拥有来自Material设计规范的数百个精心设计组件。然而其消息提示组件v
‑
snackbar使用起来对于开发者而言却不能像elementui一样便捷。
[0004]这时，基于vuetify封装一个即插即用的消息提示的插件，同时提供了丰富的样式传参以及方法，可以满足开发者的所有需求，不但可以提高用户的使用体验，也可以大大的提高开发者的开发效率。同时，为了解决插件的使用效率和扩本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于vuetify封装消息提示插件，其特征在于，S1、在渐进式框架中使用vuetify模块构建消息提示组件和目录，并设置消息提示组件中的所有参数，以动态地定义消息提示样式；S2、在所述目录里创建页面逻辑文件，使用导入模块将所述消息提示组件导入到页面逻辑文件中，在所述页面逻辑文件中调用预置的全局组件注册方法开发插件，获得第一插件；S3、构建入口文件并引入第一插件，将引入的第一插件进行注册；在预配置的模板内调用注册好的第一插件。2.根据权利要求1所述的一种基于vuetify封装消息提示插件，其特征在于，所述消息提示组件包括：消息提示类型、消息提示内容、提示多少时间消失、自定义icon图标、消息提示的位置、消息提示的变体、消息提示暗色主题、消息提示亮色主题、水平偏移量、竖直偏移量、是否显示关闭按钮、是否选择vuetify风格，以及选择elementui风格时的偏移过渡时间。3.根据权利要求1所述的一种基于vuetify封装消息提示插件，其特征在于，步骤S2中，所述一个在页面逻辑文件中进行全局组件注册的方法其具体为：S21、初始化存储定时器和每个消息提示的变量；S22、使用基础vue构造器对所述变量进行组件渲染并实例化组件；S23、若不对S22所述实例进行传参，则默认为采用vuetify风格，由于vuetify风格的消息提示是单实例，则先去存储实例的容器中查看是否存在实例，若容器中存在实例则先移除销毁上一个实例，再将所述实例存储在容器中；S24、若对S22所述实例进行传参，先判断超时是否为
“‑
1”，若不为
“‑
1”则开启一个定时器，当定时器到达时间后先清除实例中的DOM元素，然后判断是否为vuetify风格，若不是vuetify风格，则遍历存储实例的容器，移除第一个实例并清除其相应定时器，然后将其余实例进行向下偏移计算，然后使用销毁组件销毁实例，清理它与其它实例的连接，解绑它的全部指...

【专利技术属性】
技术研发人员：钱成龙，刘振威，
申请(专利权)人：南京控维通信科技有限公司，
类型：发明
国别省市：