自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

zhangqiang

对NodeJs和react native有浓厚兴趣的前端

  • 博客(35)
  • 收藏
  • 关注

原创 nodejs之multiparty插件使用解析

前端编程风格指南本指南主要针对前端语法、代码风格、应用组织做了一些约定,每条约定尽量以目前使用较多,符合大多数人习惯为原则,并解释了为什么要这样做。相信在团队开发的项目中,大家遵循同样的约定,有利于代码的整洁、项目的稳定,保证项目的可读性、易维护性和扩展性。通用篇命名约定对可维护性和可读性非常重要。本指南为文件名、方法名、变量名推荐了一套命名约定。使用驼峰命名法组件的文件名以大...

2019-11-23 21:50:07 2159

原创 docker

启动镜像 docker compose up -d。构建镜像 docker compose build。

2024-08-29 20:40:22 49

原创 抽象语法树AST

,},');

2024-08-12 17:50:49 852

原创 微服务实践和总结

这种 Shadow DOM 子树可以与某宿主元素相关联,但并不作为该元素的普通子节点,而是会形成其自有的作用域;Web Component 是一种用于构建可复用用户界面组件的技术,开发者可以创建自定义的 HTML 标签,并将其封装为包含逻辑和样式的独立组件,从而在任何 Web 应用中重复使用。元素允许开发者在 HTML 中定义一个模板,其中可以包含任意的 HTML 结构、文本和变量占位符。回顾微前端的历史,最早的时候我们是利用 iframe 嵌入一个网页,这就是微前端的雏形。

2024-07-25 19:31:42 409

原创 前端调试技巧(npm Link,vscode调试,浏览器调试等)

把传给子组件的props和事件打包起来以$attrs变量传给后代组件,可直接调用后代组件的api,避免了逐个声明props进行props的接收。在本地开发npm模块的时候,我们可以使用npm link命令,将npm 模块链接到对应的运行项目中去,方便地对模块进行调试和测试。还有另外一种方式是类似通过jsx的方式,通过一个函数传参的方式,决定是渲染哪种类型的组件。针对H5页面的简单且后续不维护的表单,使用配置进行每一个form-item的生成。补充:如果有多个tab,则可以将状态放到tabs中统一处理。

2024-07-09 10:08:40 1201

原创 前端图片适配不同屏幕方案

图片适配不同屏幕方案和JavaScript 方案实现图片的懒加载方案

2023-12-28 15:13:39 1696

原创 ES新特性和浏览器的 5 种 Observer

浏览器提供了 5 种 Observer 来监听这些变动:MutationObserver、IntersectionObserver、PerformanceObserver、ResizeObserver、ReportingObserver。5. ReportingObserver:监听过时的 api、浏览器的一些干预行为的报告,可以让我们更全面的了解网页 app 的运行情况。那么对于一些不是由用户直接触发的事件呢?比如元素从不可见到可见、元素大小的改变、元素的属性和子节点的修改等,这类事件如何监听呢?

2023-12-25 15:31:15 276

原创 python-flask笔记

flask-marshmallow + webargs 处理参数接收。psycopg2-binary postgresql操作库。Flask-SQLAlchemy orm操作库。flask-admin 超管管理后台。postgresql 数据库。python3.8 环境。Flask 后端框架。

2023-11-10 14:45:19 911

原创 vue3源码解析

vue3源码解析

2023-10-10 16:39:01 850

原创 flask+flask_sqlalchemy增删改查

中国科技大学 https://pypi.mirrors.ustc.edu.cn/simple/清华:https://pypi.tuna.tsinghua.edu.cn/simple。阿里云:http://mirrors.aliyun.com/pypi/simple/华中理工大学:http://pypi.hustunique.com/山东理工大学:http://pypi.sdutlinux.org/豆瓣:http://pypi.douban.com/simple/

2023-06-07 20:19:10 786

原创 git使用技巧

将某个远程主机的更新,全部取回本地:git fetch删除远程分支: git push origin -d 分支名删除本地分支: git branch -d 分支名查看远程分支和本地分支的对应关系:git remote show origin删除远程已经删除过的分支:git remote prune origin执行下面命令查看远程仓库分支和本地仓库的远程分支记录的对应关系:git remote show origin

2023-05-22 21:49:59 99

原创 从0开始创建自己的npm包

创建一个文件夹 util初始化 package.json。

2023-05-09 11:57:55 114

原创 使用diff-match-patch对比内容差异化

可以进行每一行的对比,比如单独行的增加、删除,以及每一行中有些单词的不同。

2023-04-19 10:49:34 1296

原创 2021-11-05

这里写自定义目录标题解决element-ui的Cascader组件数据太多显示不完全的问题解决element-ui的Cascader组件数据太多显示不完全的问题在这里插入图片描述问题解决:1.发现是css样式问题,cascader样式2.el-cascader-panel { height: 300px; }...

2021-11-05 10:27:45 220

原创 今日头条-级联组件开发过程

组件背景根据产品原型实现一个级联组件,下面看演示图应用场景很多,如:后台管理系统,广告投放系统,营销系统…等,现在流行Vue,React , Anagular 三大框架,下面看看怎么使用Vue实现实现逻辑产品经理的评审功能需求如下根据大分类到子分类层级选择,无层级限制(根据UI的横板宽度,适合做多级,但深度很深的场景并不多)每个层级支持全选,根据子级可以推导全选项选中,并对其父级执行选中操作已选层级可显示出结果列表,可对其结果操作,并有快速清空结果功能分类名称字数并不做限制,待选区域

2021-01-19 14:17:46 730 2

原创 头条之混合选择器的组件生产过程

什么是混合组件,话不多说,请先上图先解释一下选择器功能主要功能支持 支持单选 和 多选 混合存在当选择单选项时,选择结果是单选项的value当选择多选项时,选择的结果时多选项的数组 (当然,一个多选项也是数组)单选 多选不一定两级分布,也可以中间混合多选选择时,如果是未选中就选中,如果是选中就是取消当多选只有一个时,不能取消(业内也有选中不限)样式处理,选择有选择的样式 (右上角三角)选中与选中之间边框是合并的,不是双边框整个选择器的外边框是有圆角功能的,内部是方角的支持v-mod

2021-01-19 13:57:12 146 1

原创 广点通与今日头条选择时间段组件封装

你可能看到或是使用过今日头条的选择时间段组件,请先看图先解释一下选择器功能组件一周时段可选,每半个小时一个粒度,可以连续选择,可点选当鼠标拉开的选框是透明部分,松开鼠标可支持选择部分选中与取消已选时间段可以分段统计,如果连续累加,如果不连续逗号分隔选框可以8个方向拉伸,东,南,西,北,东北,东南,西北,西南当起始的单元是选中的,那么拉的选框为其反值(取消),反之也行可一键清除所有选择粒度可支持一个小时等大粒度实现逻辑拖拽选择UI部分,根据 星期一 到 星期日 生成 7个 7 *

2020-12-14 19:11:48 1188 1

原创 前端 js 库梳理

js常用工具类lodash 一个一致性、模块化、高性能的 JavaScript 实用工具库。ramda 一个很重要的库,提供了许多有用的方法,每个 JavaScript 程序员都应该掌握这个工具day.js 一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样, 体积只有2kbbig.js 一个小型,快速的JavaScript库,用于任意精度的十进制算术运算qs 一个 url参数转化 (parse和stringify)的轻量级js库dom

2020-12-03 14:21:34 371 1

原创 git前端开发分支管理规范

前端开发分支代码管理规范主要规定一下关于开发过程中的分支管理,后续大家也统一 一下:1、长期存在分支3个1、develop分支:部署开发环境的jenkins的分支2、test分支:部署测试环境的jenkins的分支3、master分支:正式环境的代码管理2、短期分支2个feature:功能分支1、开发新需求的时候,或者开发紧急需求时,都是从当前master分支上,创建一个功能分支,名为feature/xx-xx(需求功能-自己清楚的分支可以是你的名字加日期等),开发完成可以将他push到远程

2020-08-10 11:12:20 2163

原创 日常使用Linux

cd /home:进入 / home 目录pwd:显示工作路径ls -al:显示所有文件和目录的详细信息mkdir dir:创建一个叫做 dir 的目录touch file:创建一个叫做 file 的文件mv a new_a:移动或重命名一个文件或目录cp file new_file:复制一个文件cp -a dir new_dir:复制一个目录rm file:删除一个叫做 file 的文件rm -rf dir:删除一个叫做 dir 的目录并同时删除其内容chmod ugo+rwx di.

2020-06-28 19:50:52 186

原创 理解Vuex

Vuex一句话概括:state是数据源,mutation/action触发修改数据(getter封装数据),将state映射到view。Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。每个应用将仅仅包含一个 store 实例如果有些状态严格属于单个组件,最好还是作为组件的局部状态。你应该根据你的应用开发需要进行权衡和确定。----摘自官网1.State总结:存储...

2020-02-01 17:29:49 138

原创 vue组件间的通讯

在 Vue 中,父子组件之间的关系可以概述为:props 向下,events 向上。父组件通过 props 向下传递数据给子组件,子组件通过 events 发送消息给父组件。(1)父传子1.父组件调用子组件时传入变量log-content:<log ref="log" :log-content="logContent"></log>2.子组件通过props...

2020-02-01 17:22:40 120

原创 babel6 + runkoa

在node.js中使用babel6的方法.安装babel6npm install babel-core –save安装插件npm install babel-preset-es2015配置bedel6方法1 . 新建 .babelrc 文件{ "presets": ["es2015"]}方法2 在pageage.json里面配置"babel": { "pre...

2020-01-31 10:13:41 134

原创 node实现批量上传文件并携带进度条的demo

最近做的一个项目很多批量上传图片和文件的需求,产品说需要写一个带进度条动画的批量上传文件的组件,结果他们后端(python)跟我说不能多文件上传,我一听就很尴尬了,怎么可能不能多文件呢哈哈,后来我只是告诉他进度条的实现方式,在过了2天后我一直对此事耿耿于怀,所以干脆自己动手用node写了一个多文件上传的demo,并记录下来。前端: http请求为自己封装的一个原生请求函数,一切以原生代码为主;...

2020-01-04 21:18:19 828

原创 微信授权和jssdk部分接口的笔记

准备工作微信接口测试号 申请地址微信开发者工具授权登录流程前端引导用户授权(跳转授权链接)var APPID = 'wx32fewr344' // 公众号的appidvar REDIRECT_URI = 'http://127.0.0.1:8081/VDS/wechat/auth.html' // 重定向的页面,请求微信授权页面后,微信服务端重定向的页面,微信会在这个页面的url后...

2019-12-30 19:53:51 462

原创 pm2使用总结~

主要特性内建负载均衡(使用 Node cluster 集群模块)后台运行0 秒停机重载,我理解大概意思是维护升级的时候不需要停机.具有 Ubuntu 和 CentOS 的启动脚本停止不稳定的进程(避免无限循环)控制台检测提供 HTTP API远程控制和实时的接口 API ( Nodejs 模块,允许和 PM2 进程管理器交互 )常用命令$ npm install pm2 -...

2019-12-29 10:56:53 642

原创 前端js继承

js继承的6种实现方式定义父类// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = function(){ console.log(this.name + '正在睡觉!'); }}// 原型方法Animal.prototype.e...

2019-12-23 21:14:57 203 1

原创 npm快速发布自己的模块

创建注意创建模块前,先去 npm 官网确认模块名是否未被占用npm init添加账号$ npm adduserUsername: your namePassword: your passwordEmail: yourmail@gmail.com发布npm publish编辑 .npmignore如果文件夹中存在 .gitignore, 则 .npmignore 与之相同...

2019-12-22 15:06:20 146

原创 使用axios读取远程图片保存到本地

const axios = require('axios');var fs = require('fs'); axios.get('http://zhangqiang.win/img/random/2.png', { responseType: 'arraybuffer' }) .then(function(response) { console.log(response...

2019-12-15 18:25:08 2521 2

原创 学习游戏demo(函数式编程、命令模式、工厂模式)

<!-- // replay.html --> <canvas class="box" id="canvas" width="500" height="500"></canvas> <div> <button type="button" id="start">start</button> <but...

2019-12-15 18:00:17 159

原创 egg架构学习记录

一个 egg 应用能运行起来,并不单纯的靠 egg 模块,这个是用过的同学都知道的,但是到底它是如何跑起来的呢,整体涉及到了多少个模块呢,这篇文章就是大概跟大家粗略分析这些了首先 egg 应用跑起来离不开下面几点egg-bin(开发模式下)egg-scripts (线上环境,其实 egg-bin 也是跑的 egg-scripts)egg-cluster (由 egg-scripts 调用...

2019-12-05 11:23:25 419

原创 利用ffmpeg转ts视频,通过jsmpeg.js播放(自动播放视频,无video默认控制条)

最近研究了下视频自动播放,无控制条问题,记录下。尝试解决加autoplay“视频自动播放”这个需求是ok的,那我就在video标签上加个autoplay属性嘛,在PC端浏览器里面试了一下,运行流畅,没有遇到什么问题,但是放在手机浏览器里面打开,就跟没设置autoplay是一样的。监听canplay那不行的话,我在页面加载完成的时候,监听video的canplay,然后执行play(),应...

2019-12-04 18:32:26 7434

原创 作用域and闭包

一、块作用域大家可以将块作用域理解为局部变量所在的词法作用域内,形象的给个demo就是↓function zoom(){ var me='我是zoom作用域下的局部变量me'; console.log(me); //'我是zoom作用域下的局部变量me'}console.log(me); //Reference这个时候zoom函数就是一个块作用域了;那么for...

2019-12-01 11:03:23 89

原创 前端编程风格指南

本指南主要针对前端语法、代码风格、应用组织做了一些约定,每条约定尽量以目前使用较多,符合大多数人习惯为原则,并解释了为什么要这样做。相信在团队开发的项目中,大家遵循同样的约定,有利于代码的整洁、项目的稳定,保证项目的可读性、易维护性和扩展性。通用篇命名约定对可维护性和可读性非常重要。本指南为文件名、方法名、变量名推荐了一套命名约定。使用驼峰命名法 组件的文件名以大写开头(例如Use...

2019-12-01 10:31:21 233

原创 H5视频退出全屏事件

移动端视频默认全屏播放,用户可点击视频自带退出全屏按钮来退出全屏。当我们想在用户点击退出全屏时,顺便关闭视频,这时就要用到监听视频退出全屏事件。实例:<div id="ctn" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; z-index: 10;"> &...

2019-11-23 22:05:12 1927

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除