老白干的zone

原创 EventStream获得数据流，前端配置获得推送的流

如上图所示，请求一个接口，接口以数据流的方式向客户端推送数据，默认需要消息收集一条，在原来的基础上追加，在create-react-app生成的工程中，如果代理使用了中间件http-proxy-middleware，同时devServer设置了compress： false或未设置时，则可以正常接收每一条。如果使用了@craco/craco，则会出现一次性接收所有消息，同时一次性渲染。1. 在devServer的配置中增加如下配置。

原创 tailwind&open-props

2. open-props for create-react-app工程配置。1. tailwind for create-react-app工程配置。在其它css中可使用open-props提供的变量。ide不会报无法识别css自定义属性的错误。入口index.css头部引入。

原创 webstorm无法解析自定义css属性（如tailwind css变量）

不合法css私有属性检查

原创 关于js中keycode被弃用的解决替换方案

原创 Mac IDEA解决Maven项目命令行报错：command not found: mvn

将idea自带的mvn命令设置为全局

原创 抠某区域地图方法

2. 选择要抠出来的区域，右侧选择要下载的json文件，如红框所示。3. 打开下载的文件，内容全部复制。5. 如下图所示，将下载文件内容赋值。1.打开阿里云数据可视化平台。4. 打开百度地图示例。

原创 idea中项目编码全局统一utf-8

原创 redux connect组件在手工传入参数时报错

redux使用connect创建一个高阶组件时后，如果手工给该组件传入参数时会因参数不同会报错，此时可以如下处理：

原创 移动端判断是否为ios&网页适配ios安全区

1. -webkit-touch-callout属性用法极少，可参考。2. iphone安全区适配方案。

原创 npm publish包报404，is not in the npm registry错误

2. 登录npm，使用登录名发布包，包名命名原则“@登录名/包名”，或 “包名”

原创 package.json中workspaces详解与monorepo

参考。

原创 pnpm 升级

3. sudo npm install -g pnpm 重新安装，node默认使用16。2. 执行which pnpm，在结果目录中删除pnpm。1. 在以下路径下删除pnpm包。

原创 10个Lambda表达式提高效率

【代码】10个Lambda表达式提高效率。

原创 mysql:[Some non-transactional changed tables couldn‘t be rolled back]不支持事务

3. 原来使用MyIsam创建的表同样不支持，需要新建表，或通过alter命令修改原来创建的表引擎为innoDB，【修改表引擎】1. mysql创建表时默认引擎MyIsam，因此不支持事务的操作；【my.conf详情说明】

原创 [mysql]lower_case_table_names导致的：version mismatch: library version is ‘6.5.0.1‘, db version is问题

unix,linux下lower_case_table_names默认值为 0 .Windows下默认值是 1 .Mac OS X下默认值是 2。lower_case_table_names = 1 表名存储在磁盘是小写的，但是比较的时候是不区分大小写。lower_case_table_names=2 表名存储为给定的大小写但是比较的时候是小写的。lower_case_table_names=0 表名存储为给定的大小和比较是区分大小写的。

原创 CMS系统使用catalina.sh启动时报错：java.net.SocketException: Can‘t assign requested address

使用编辑器打开tomcat/bin/catalina.sh，搜索JAVA_OPTS=，在搜索结果第一项前追加。

原创 mac下安装tomcat

2. 授权bin目录下所有.sh文件权限sudo chmod 755 *.sh。4. 关闭程序 sudo sh ./shutdown.sh。3. 启动程序 sudo sh ./startup.sh。

原创 mac下source不起作用

bashrc配置

转载 (fileList || []).forEach is not a function；图片上传错误

表单中上传文件组件报错

原创 TS2528: A module cannot have multiple default exports.

TS2528: A module cannot have multiple default exports.解决方案

原创 DatePicker组件日期国际化错误

antd datepicker中文翻译不彻底

原创 react之useState相互依赖数据更新问题

useMemo使用方法

原创 canvas实现水印效果

canvas两种实现水印效果

原创 macOS Monterey12.4编译安装 Nginx，以及 PCRE 编译

nginx

原创 立即执行函数与let

在javascript中没有私有作用域的概念，其实现在的es6中的let声明就是为了解决这样的问题。但是在国内大部分公司的面试官还是喜欢去问一下var声明的问题或立即执行函数的问题。1.js查找变量遵循由内而外，一层一层的查找，查到就不再向上查找了，直到查不到返回undefined;什么是私有作用域呢，如下例：var a = 100;if(a>10){ var b = 200;}...

原创 寄生构造函数——扩展原生数组

最近在产品研发过程中，发现需要对原生数组进行一些扩展，我们深知修改原生对象的弊端，尤其在产品化的程序中修改原生对象的原型。如果因某个实现中缺少某个方法，就在原生对象的原型中添加这个方法，那么当在另一个支持该方法的实现中运行代码时，就可能会导致命名冲突。而且，这样做也可能会意外地重写原生方法，大名鼎鼎的prototype框架败因也在于此，改写了大量原生对象，当ECMAscript升级时，面临着许多改

原创 焦点图

在项目开发中，有一些经常会用到的效果，比如焦点图轮播，效果虽已司空见惯，但对于初学者来说，还是没有思路，只能网上下载，下载的一大堆代码又看不明白，无论布局还是js控制，只能撞大运式移置到项目上，不但影响了工作效率，还影响了项目的质量。

原创 生僻字组件

在最近的项目中，对目前现有的生僻字组件进行了重写，该组件主要用于一些人名中经常出现的生僻字的管理，方便用户在输入法不能拼出来时，输入自己名字中的生僻字！最终实现的效果如下图所示：具体的代码以jQuery插件代码的方式编写，如下：/**创建人：安超 创建日期：2013年5月16日在用户录入汉字时，对于一些生僻怪字有时没法输入，此组件收集生活中经常用到的生僻字，让用户可

原创 jQuery读取XML文件

在最近项目中，ajax返回的数据格式为“XML”，如何对XML格式的数据进行解析？大部分项目如果使用ajax请求，返回数据格式基本上都是json格式；下面就以实际项目为例进行xml格式数据的分析。从报文中已经截获到xml格式的数据如下：

原创 div显示在object、embed插件之上

项目中经常会遇到要求在embed内容可以被div遮挡，实际上就是个播放器，当div移到插件上面时候不会被播放的内容挡住，搜寻了很久才勉强找到了个不完美的解决方案。这里先介绍下在embed会遮挡住div的原因：我们平常所做的plugin无非两种，有窗体的和无窗体的，有窗体的插件是不透明的（opaque）将会遮挡其他部分，其优先级在页面中也较高，一般的DOM元素都要被其遮挡，这个时候设置z-i

原创 jQuery最新版API视频完全呈现

目前，jQuery作为一个优秀的javascript框架已经发行到了1.9版（提供295个方法），其优秀的设计理念和完美地兼容性，完全征服了这个时代。因其高效的版本更新，往往我们的学习速度跟不上它的更新速度。作为使用者，如何快速地掌握它，则已成为一大部分人的一个愿望。虽然它有着完善的API，但无奈英文水平太洼，只能望而却步。国内也有一些无私奉献的良民对其进行了翻译，但对于懒惰和忙碌的程序员来说，个

原创 字符串处理截取slice、substring、substr的异同

在项目开发过中，字符串是一种很特殊的东西，不可逃避地要经常对其处理，截取获得某几个字符是一种经常的事情。然而，在面试题中也经常出现对字符串处理的一些问题，尤其一些大公司，比如：慧*网，最近看其面试题中就有一道：说一下falsh编程中slice()、substring()、substr()的相同点和不同点？　　分析该题，其实并不难，但很基础，很多人都用过这三个方法，但都是基于js的，至于fals

转载 奇文共欣赏 疑义相与析

最近在整理公司前端的框架源代码，其中涉及到好多的正则表达式，为了复习一下这部分的知道，在网上了找了一篇比较详细的教程，http://www.cnblogs.com/deerchao/archive/2006/08/24/zhengzhe30fengzhongjiaocheng.html，以供大家参考阅读。　　《编写高效的CSS选择器》http://www.oschina.net/transla

原创 js中的垃圾回收机制

js具有自动垃圾回收机制，也就是说，执行环境会负责管理代码执行过程中使用的内存。而在C和C++之类的语言中，开发人员的一项基本任务就是手工跟踪内存的使用情况，这是造成许多问题的根源。在编写js程序时，开发人员不用关心内存使用问题，所需内存的分配以及无用内存的回收完全实现了自动管理。这种垃圾回收机制的原理其实很简单：找到那些不再继续使用的变量，然后释放其所占用的内存。为此，垃圾回收器会按照固定的时间

原创 javascript的执行环境及作用域

执行环境是js中最为重要的一个概念。执行环境定义了变量或函数有权访问的其他数据，决定了它们各自的行为。每个执行环境都有一个与之关联的变量对象，环境中定义的所有变量和函数都保存在这个对象中。虽然我们编写的代码无法访问这个对象，但解析器在处理数据时会在后台使用它。　　全局执行环境是最外围的一个执行环境。根据ECMAScript实现所在的宿主环境不同，表示执行环境的对象也不一样。在Web浏览器中，全

原创 js中的object类型

Object类型： 一组数据和功能的键值对集合，也是顶级“父类”。Object类是所有Javascript类的基类(IE的Javascript实现在对象方面稍有不同，在IE中，只有开发人员定义的对象才继承自Object。而且，所有BOM和DOM对象也与这里介绍的不同，可能不会具有Object的所有属性和方法)，提供了一种创建自定义对象的简单方式，不需要程序员再自定义构造函数。主要属

原创 动态创建表格之兼容性

导语：表格在页面中虽已不是主流的布局方式，但在实际的开发过程中经常会遇到一些要动态创建表格数据的场景，如何完全兼容现在所有的浏览器是一个问题，目前我的解决方案如下，但检查在IE9下运行不兼容！！！！！！！！                var json = [{ "name": "博客园", "url": "http://www.cnblogs.com" }, { "nam

原创 我熟知的三栏自适应高度的布局

导语：最近，一个朋友问我大家耳熟能详的一些网页布局，由于平时仅为了实现某些布局而无暇总结，在此对个别典型布局进行一个小结，以此供大家研究。一个三栏的自适应高度的布局：方案一（绝对定位）：页面html:页面css:html, body { margin: 0px; height: 10

原创 jsonP——原生跨域和jquery方式跨域

导语：在实际开发中，经常会调用一些其他域上提供的数据，其格式大部分为json格式的数据，怎么解决这种跨域问题呢，web前端开发工程师在面试中是经常会被问到的。因此特做一个小Demo以供大家参考。一、在外域的服务器上创建一个服务器端的文件（以asp.net开发为例）     创建一个一般处理程序json.ashx：public void ProcessRequest(Ht

原创 跨域Iframe的一些操作

导语：在实际开发过程中经常会遇到一些跨域问题，如通过iframe嵌入一个跨域的页面。这个问题也是在面试时，那些项目经理经常喜欢提及的，因此做一个小Demo以供大家参考。首先创建一个远程服务器上的页面test.html: 远程页面 function f1() { var userName = document.getEl