Linzsong-优快云博客

原创 vue插件发布到npm(消息弹窗插件)

vue插件发布到npm(消息弹窗插件) 一、Demo描述本次演示的是一个使用 vue 发布自己的插件——custom-message-song这是一个简单消息弹窗插件（为下一个重量级插件“自定义表单”插件发布做练习准备），这次就来小试牛刀，从插件的开发到发布npm，我都踩了哪些坑[流泪]，让我们现在开始吧。开发环境版本： @vue/cli 4.5.14 Vue2.x (Vue3.x的发布后期更新) 所有代码都可以在我的GitHub custom-message-song 上查看,欢迎start…

2022-01-17 11:56:04 1054

原创排序算法之——快速排序

排序算法之——快速排序 1、序作为一名前端开发工程师，算法也是不可以不略的一part，特别是排序，在项目实际开发中，也会经常用到。今天我们就一起重温一下，什么是快速排序，它是如何进行排序的，最后我们再手写一个快速排序。 2、什么是快速排序，如何进行排序呢？快速排序（ Quicksort ）是对冒泡排序算法的一种改进，排序规则如下：选择一个中心点Pivot（在这里我选择的是最左边的第一个值为中心点）；选定两个指针，分别是 L 和 R 分别指向数组最左边和最右边的位置；将R指向的数据和Pivo

2021-05-21 10:35:40 944

原创 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 3289 2

原创 el-input中监听键盘事件“回车”和“Tab”

el-input中监听键盘事件“回车”和“Tab” <el-input @keyup.enter.native="test($event)" @keydown.tab.native="test($event)"> </el-input>  test(e) { e.preventDefault(); // 阻止Tab的默认事

2021-03-30 16:49:59 1702

原创 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 4787

原创 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 3897 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 421

原创 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 1366

原创 vue-slicksort拖拽组件——添加点击事件

在项目中我个人使用了slicksort和draggable这两个拖拽插件，在这里总结一下slicksort插件的优点，最大的特点个人觉得是很滑（都叫slick sort 翻译过来就是光滑排序）。但在使用该拖拽前，必须先看一下slicksort的demo，看是否满足你个人的需求，毕竟有些需求在slicksort中是不好实现的（如：跨组拖拽，就得用draggable比较好处理）该插件GitH...

2019-12-27 15:32:06 2443

原创从0到1安装并运行Vue

从0到1安装并运行Vue步骤步骤 1.先安装nodejs环境，这样就可以使用其中的npm了点击下载node.js 2.安装，直接点击下一步就完事了，然后测试是否安装成功,-v查看安装的版本号 node -v npm -v 3.使用前可以更新一下npm的版本号，因为npm更新的频率比node.js高，到这里npm就算安装完成了 npm install npm@latest -g 4.安...

2019-11-07 15:00:22 331

原创 npm install 运行报错，错误代码128解决方案

报错信息如下： error Error while executing: error D:\Git\Git\bin\git.EXE ls-remote -h -t git://github.com/adobe-webplatform/eve.git error error fatal: unable to look up github.com (port 9418) (Ӧ�ó��û�е�� W...

2019-09-06 15:39:05 38088 16

原创 jq封装websocket插件，实现聊天室重连机制、心跳机制

此jq封装方法来自于这里代码简单易懂，如下： //jqwebsocket.js //==========websocket (function($) { $.websocket = function(options) { var defaults = { domain: top.location.hostname, port...

2019-08-20 00:10:58 2311

原创 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 9087

转载微信小程序中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 9582 1

Linzsong的博客