- 博客(14)
- 收藏
- 关注
原创 vue插件发布到npm(消息弹窗插件)
vue插件发布到npm(消息弹窗插件)一、Demo描述本次演示的是一个使用 vue 发布自己的插件——custom-message-song这是一个简单消息弹窗插件(为下一个重量级插件“自定义表单”插件发布做练习准备),这次就来小试牛刀,从插件的开发到发布npm,我都踩了哪些坑[流泪],让我们现在开始吧。开发环境版本:@vue/cli 4.5.14Vue2.x (Vue3.x的发布后期更新)所有代码都可以在我的GitHub custom-message-song 上查看,欢迎start…
2022-01-17 11:56:04
973
原创 排序算法之——快速排序
排序算法之——快速排序1、序作为一名前端开发工程师,算法也是不可以不略的一part,特别是排序,在项目实际开发中,也会经常用到。今天我们就一起重温一下,什么是快速排序,它是如何进行排序的,最后我们再手写一个快速排序。2、什么是快速排序,如何进行排序呢? 快速排序( Quicksort )是对冒泡排序算法的一种改进,排序规则如下:选择一个中心点Pivot(在这里我选择的是最左边的第一个值为中心点);选定两个指针,分别是 L 和 R 分别指向数组最左边和最右边的位置;将R指向的数据和Pivo
2021-05-21 10:35:40
875
原创 Element UI实现动态表格(输入框和选择框),可使用快捷键tab、Enter、Down、Up进行切换格子
Element UI实现动态表格1. 实现效果话不多说,直接上图图1(整体效果)图2(动态图)图3(Tab 和 Enter切换下一格)图4(Up和 Down 对input框进行上下切换)2. 核心代码实现首先是要获取格子的index和列prop(唯一值),获取的方法可以看这个 element UI 在table中获取点击当前行列索引激活input和select是通过table的rowIndex和列prop(唯一值)来定位判断点击的为哪一个格子...
2021-04-19 09:04:14
3076
2
原创 el-input中监听键盘事件“回车”和“Tab”
el-input中监听键盘事件“回车”和“Tab”<el-input @keyup.enter.native="test($event)" @keydown.tab.native="test($event)"></el-input><!-- 注意这里的Tab键 要使用 keydown监听,使用keyup监听无效,具体原因,希望有热心的网友给予指正-->test(e) { e.preventDefault(); // 阻止Tab的默认事
2021-03-30 16:49:59
1598
原创 element UI 在table中获取点击当前行、列索引
在table中获取点击当前行、列索引先开启table中的:cell-class-name="tableRowClassName",将rowIndex 和columnIndex 放入row 和 column 的属性中再table中使用 @cell-dblclick="handleCellClick"函数tableRowClassName ({row, column, rowIndex, columnIndex}) { //把每一行的索引放进row,和index row.ind
2021-03-30 16:47:50
4546
原创 Vue实现自定义Message
Vue实现custom-message前言之前在项目中使用vue框架中的element-UI时,使用element-UI的弹窗非常的nice,但在最近的项目中,要求项目体积小,且高度自定义,所以不能把element-UI的message的组件引进来再改样式,于是决定自己封装一个,来满足需求。基本原理使用Vue.extend(options)创建一个Vue构造器,再将构造器实例化,挂载到body中...const MessageBox = Vue.extend(MessageMain);...
2020-09-01 15:27:23
3799
3
转载 CSRF攻击原理和防御方法
转载一批关于CSRF的好文章CSRF概念:CSRF跨站点请求伪造(Cross—Site Request Forgery),跟XSS攻击一样,存在巨大的危害性,你可以这样来理解:攻击者盗用了你的身份,以你的名义发送恶意请求,对服务器来说这个请求是完全合法的,但是却完成了攻击者所期望的一个操作,比如以你的名义发送邮件、发消息,盗取你的账号,添加系统管理员,甚至于购买商品、虚拟货币转账等。 如下:其中Web A为存在CSRF漏洞的网站,Web B为攻击者构建的恶意网站,User C为Web A网站的合法用户。
2020-08-19 17:32:30
365
原创 2048小游戏思路
在面试的时候被面试官问道2048的实现思路,以下是总结。2048小游戏思路1、初始化,在空格子中产生两个2,4的随机数。(1)封装生成随机数方法,将min + Math.round((max-min) * Math.random())封装为getRandom(min,max)方法,该方法接受两个值,最大值max和最小值min,getRandom方法是获取[min,max]之间的一个随机数;...
2020-03-17 23:33:17
1275
原创 vue-slicksort拖拽组件——添加点击事件
在项目中我个人使用了slicksort和draggable这两个拖拽插件,在这里总结一下slicksort插件的优点,最大的特点个人觉得是很滑(都叫slick sort 翻译过来就是光滑排序)。但在使用该拖拽前,必须先看一下slicksort的demo,看是否满足你个人的需求,毕竟有些需求在slicksort中是不好实现的(如:跨组拖拽,就得用draggable比较好处理)该插件GitH...
2019-12-27 15:32:06
2360
原创 从0到1安装并运行Vue
从0到1安装并运行Vue步骤步骤1.先安装nodejs环境,这样就可以使用其中的npm了 点击下载node.js2.安装,直接点击下一步就完事了,然后测试是否安装成功,-v查看安装的版本号node -vnpm -v3.使用前可以更新一下npm的版本号,因为npm更新的频率比node.js高,到这里npm就算安装完成了npm install npm@latest -g4.安...
2019-11-07 15:00:22
276
原创 npm install 运行报错,错误代码128解决方案
报错信息如下:error Error while executing:error D:\Git\Git\bin\git.EXE ls-remote -h -t git://github.com/adobe-webplatform/eve.giterrorerror fatal: unable to look up github.com (port 9418) (Ӧ�ó���û�е��� W...
2019-09-06 15:39:05
37676
16
原创 jq封装websocket插件,实现聊天室重连机制、心跳机制
此jq封装方法来自于这里代码简单易懂,如下://jqwebsocket.js//==========websocket(function($) { $.websocket = function(options) { var defaults = { domain: top.location.hostname, port...
2019-08-20 00:10:58
2202
原创 HTML简单页面页码的设计
HTML简单页面页码的设计&lt;!DOCTYPE HTML&gt;&lt;html&gt;&lt;head&gt; &lt;title&gt;HTML页码设置&lt;/title&gt; &lt;meta http-equiv="Content-Type" content=&a
2018-12-18 20:25:25
8924
转载 微信小程序中this.setData is not a function报错问题
微信小程序中this.setData is not a function报错问题新手在编写小程序时经常会遇到的一种错误。新手在编写小程序时经常会遇到的一种错误。在小程序中,通常我们用setData修改数据,用于函数时不会报错。eg.setData function(e){ this.setData({ mobileLocation: mobileLocatio...
2018-12-14 21:50:31
9274
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人