随笔分类 - 前端
摘要：本文发布自 https://www.cnblogs.com/wenruo/p/15061907.html 转载请注明出处。 简介和 Demo 展示 最近需要有个拖拽列表的需求，发现一个简单好用的 Vue 可拖拽组件。安利一下~ Vue Smooth DnD 是一个快速、轻量级的拖放、可排序的 Vue
阅读全文
摘要：一直使用 Vue/React ，习惯了用组件，偶尔想用原生三剑客写点 Demo 发现样式丑的不忍直视。最近看 掘金小册《玩转CSS的艺术之美》看到 CSS 相关的内容，发现原生 CSS 也可以把表单处理的很好看。 效果： 完整代码： <!DOCTYPE html> <html lang="en">
阅读全文
摘要：vite.config.js build: { rollupOptions: { output: { entryFileNames: `assets/[name].${timestamp}.js`, chunkFileNames: `assets/[name].${timestamp}.js`, a
阅读全文
摘要：1、Node版本 >= 13 2、使用 ES6 模块 a.js export const A = 'A'; index.js import { A } from './a.js'; console.log(A); 3、创建 package.json { "type": "module" } 4、直接
阅读全文
摘要：1、修改打包路径 在 vue.config.js 中添加 publicPath 配置，其中 teambition-vue 是你项目的 github 名字。否则会找不到资源。 module.exports = { ... // 部署到github publicPath: process.env.NOD
阅读全文
摘要：最简单的使用方法，记录怎么部署静态的前端文件。 查看是否有正在运行的 Nginx 进程 ps -ef | grep nginx 查看安装的 Nginx 版本 nginx -v 在Ubuntu/Debian系 sudo apt-get install nginx 或者RedHat/CentOS系 su
阅读全文
摘要：常用的服务端推送技术，包括轮询、长轮询、websocket、server-sent-event（SSE） 传统的HTTP请求是由客户端发送一个request，服务端返回对应response，所以当服务端想主动给客户端发送消息时就遇到了问题。常见的业务场景如新消息提醒。 1、轮询（Polling） 最
阅读全文
摘要：使用nvm安装，简单方便，且能安装多版本。 先安装 nvm https://github.com/nvm-sh/nvm#installing-and-updating 安装 运行命令 或者 成功后会看到如下输出 重新打开一个新的终端窗口或者在当前窗口输入 来运行 nvm 输入 nvm -versio
阅读全文
摘要：Decorator 的语法还没有通过提案，所以项目中很少用。不过最近刚好有一个需求用到了。 装饰器的语法 http://es6.ruanyifeng.com/#docs/decorator 需求是，有很多操作都需要二次确认，因为用到的是 element ui 组件，所以就需要在每个函数中都加一个确认
阅读全文
摘要：因为要在 router 对应一个路由的组件才可以触发 如果没有将 App.vue 作为某个路由组件（一般不会吧） 就不会触发该导航守卫 应该是想在每次进入应用时加载一些数据 所以放在 App.vue 的 created 声命周期 或者放在全局的路由钩子 router.beforeEach 里吧
阅读全文
摘要：在 Vue 中 使用 Element UI，使用表单 el-form 只有一个 el-input 项，使用 @keyup.enter.native 来处理回车事件。 结果发现按下回车时页面总会被刷新？？ 第一反应查询关键字 vue、 element、 el-form …… 结果发现是 HTML 的已
阅读全文
摘要：目录 基础概念 开始绘制图形 [1. 通过代码构建图形](#1. 通过代码构建图形) [2. 通过 GraphObject.make 构建图形](#2. 通过 GraphObject.make 构建图形) [3. 使用 Model 和 Templates 创建图形](#3. 使用 Model 和 T
阅读全文
摘要：如果您发现错误，请一定要告诉我，拯救一个辣鸡（但很帅）的少年就靠您了！ 本文适合有 JavaScript 基础 && 面向搜索引擎书写正则的人群。 正则表达式是用于匹配字符串中字符组合的模式。正则表达式的模式规则是由一个字符序列组成的。包括所有字母和数字在内，大多数的字符都是直接按照直接量描述待匹配
阅读全文
摘要：阅读 redux 源码之后，想要加深一下对中间件的理解，于是选择 redux-thunk（2.3.0）这个源码只有十几行的中间件。 之前 redux 的学习笔记 https://www.cnblogs.com/wenruo/p/9664375.html redux 中的 applyMiddlewar
阅读全文
摘要：大过年的，要不要写点代码压压惊？来花十分钟学一下怎么通过 NPM 构建一个命令行工具。 写了一个小 demo，用于代替 touch 的创建文件命令 touchme ，可以创建自带“佛祖保佑”注释的文件。效果如下： 命令可以带有一个参数，选择注释的符号 现在，开始撸代码 ~ 首先创建一个文件夹，我起名
阅读全文
摘要：首先 导航链接应该使用 NavLink 而不再是 Link NavLink 使用方法见 https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/docs/api/NavLink.md Na
阅读全文
摘要：实现效果：（可戳 https://codepen.io/wenr/pen/EGEQxp 查看） 因为工作中会用到 JIRA 所以想实现一下相似的功能，顺便学习一下 H5 的拖拽。不支持拖拽改变顺序，感觉有点麻烦，而且没必要。感觉相关的博文好少的，大部分都是直接上代码，没有解释。 图片默认可以拖动，其
阅读全文
摘要：上接 Underscore.js 源码学习笔记（上） 756 行开始 函数部分。 var executeBound = function(sourceFunc, boundFunc, context, callingContext, args) { if (!(callingContext inst
阅读全文
摘要：版本 Underscore.js 1.9.1 一共 1693 行。注释我就删了，太长了… 整体是一个 (function() {...}()); 这样的东西，我们应该知道这是一个 IIFE（立即执行函数）。 var root = typeof self == 'object' && self.sel
阅读全文
摘要：写过 React ，用的是 create-react-app ，写过 Vue ，用的是 vue-cli , 第一次想了解一下 Webpack 。 我的环境 Mac OS, node: v8.11.1, npm: 5.6.0, Webpack: 3.12.0 0. 什么是Webpack 我就不说乱七八
阅读全文