资讯专栏INFORMATION COLUMN

【demo】单例模式弹窗组件

史占广 / 785人阅读

摘要:写了一个弹窗组件。在原型里定义基本的功能,我这里主要写了弹窗的确认按钮和取消按钮以及创建弹窗的事件。是用单例模式实例化一个弹窗。因为用了单例模式,我不能通过多次实例化改变弹窗内容,所以写了一个的函数来改变弹窗内容。

写了一个弹窗组件demo。代码在这里

基本功能

添加弹窗标题;添加弹窗内容;弹窗的确认和取消按钮。写这么demo的初衷是为了让自己的页面中只有一个弹窗,所以用了单例模式。

效果图

代码解释

1.options是初始化弹窗的参数。
2.在原型里定义基本的功能,我这里主要写了弹窗的确认按钮_sure和取消按钮_cancel以及创建弹窗_create的事件。
3.getPopup是用单例模式实例化一个弹窗。
4.因为用了单例模式,我不能通过多次实例化改变弹窗内容,所以写了一个_changeHtml的函数来改变弹窗内容。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/82836.html

相关文章

  • 重写GridView实现仿今日头条的频道编辑页(1)

    摘要:但由于这里仅仅是实现一个,因此存储功能仅通过一个单例类来模拟实现。 本文旨在通过重写GridView,配合系统弹窗实现仿今日头条的频道编辑页面 注:由于代码稍长,本文仅列出关键部分,完整工程请参见【https://github.com/G9YH/YHChannelEdit】 在开始讲解盗版的实现方案前,让我们先来看看正版与盗版的实际使用效果对比,首先是正版 showImg(https:...

    张宪坤 评论0 收藏0
  • 再遇设计模式之JavaScript篇

    摘要:在面向对象的语言中,比如,等,单例模式通常是定义类时将构造函数设为,保证对象不能在外部被出来,同时给类定义一个静态的方法,用来获取或者创建这个唯一的实例。 万事开头难,作为正经历菜鸟赛季的前端player,已经忘记第一次告诉自己要写一些东西出来是多久以的事情了。。。如果,你也和我一样,那就像我一样,从现在开始,从看到这篇文章开始,打开电脑,敲下你的第一篇文章(或者任何形式的文字)吧。 ...

    Clect 评论0 收藏0
  • JavaScript 设计模式(一):单例模式

    摘要:停更许久,近期计划更新设计模式系列。单例模式是创建型设计模式的一种。虽然它不是正规的单例模式,但不可否认确实具备类单例模式的特点。适用场景单例模式的特点,意图解决维护一个全局实例对象。 停更许久,近期计划更新:设计模式系列。 showImg(https://segmentfault.com/img/bVbt7uw?w=800&h=600); 单例模式:限制类实例化次数只能一次,一个类只...

    xialong 评论0 收藏0
  • vue2实践(持续更新)

    摘要:记录一些小技巧和踩过的坑由于本篇文章内容太多,导致编辑器有点卡,所以新开辟了一篇实践二,后续再这里更新。组件的生命周期函数是在标签里的数据发生变化时候触发数据可能更新了,但是没有绑定到上面的话,不会调用钩子函数。 记录一些小技巧和踩过的坑 由于本篇文章内容太多,导致SF编辑器有点卡,所以新开辟了一篇 vue2实践(二),后续再这里更新。 1. props 带不带冒号的区别 ...

    n7then 评论0 收藏0

发表评论

0条评论

史占广

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<