前端
Jamki小烽烽
这个作者很懒,什么都没留下…
展开
-
【WebSocket应用解析】看完了还敢说不懂WebSocket吗?
本文始发于我的个人网站:https://www.jianfengke.com/WebSocket是啥Websocket是一个持久化的网络通信协议,可以在单个 TCP 连接上进行全双工通讯,没有了Request和Response的概念,两者地位完全平等,连接一旦建立,客户端和服务端之间实时可以进行双向数据传输.WebSocket跟Http区别与联系HTTP是非持久的协议,客户端想知道服务端的处理进度只能通过不停地使用 Ajax进行轮询或者采用 long poll 的方式来,但是前者对服务器压力大,后原创 2020-10-16 13:39:14 · 684 阅读 · 1 评论 -
面试官问你:请实现bind完整功能
由于js中this的存在,bind显得尤其重要,它能够显式强绑定this到某特定环境中,用过react的朋友应该知道bind在代码中出现的频率,在绑定函数方法时常用bind来绑定上下文对象到方法上。因此很多面试中常常能看到实现bind方法的面试题,不了解的同学们还以为是啥高深的问题,实际上理解的bind的几个功能点,写出来是不难的,下面来详细探讨一下啦~~bind具体用法:下面是MDN里对bind的解释:bind() 方法创建一个新的函数,在 bind() 被调用时,这个新函数的 this 被指定为原创 2020-06-16 10:26:47 · 318 阅读 · 0 评论 -
听说你定义了text-overflow: ellipsis 没生效?
朋友们有没有试过这种情况?overflow: hidden;text-overflow: ellipsis;white-space: nowrap;一口气三连后没看到有省略号出现?然后开始胡乱该碰运气期待能生效?现在将会给出准确无疑得解决方法,走起我们首先要知道:text-overflow:ellipsis;这个属性,只会在以下条件均成立时才生效:包裹文字的容器一定要有确定的宽度,有确定单位宽度,如100px, 而要注意的是百分比单位(%)无效,很多人都是因为给容器定了百分比宽度而导致te原创 2020-05-24 00:38:50 · 4273 阅读 · 4 评论 -
css import 使用 webpack 配置的alias 相对路径
问题背景webpack中定义alias相信很多人都知道,在引入文件的时候比较方便不需要写冗长的引用地址,在webpack里定义这个: resolve: { alias: { '@': path.resolve(__dirname, 'src/') } }则引入文件时 @ 则表示src目录然后在使用import导入css文件时,使用alias`定义的地址简写却出现问题* -!../../../node_modules/css-loader/dist/原创 2020-05-15 15:37:37 · 853 阅读 · 0 评论 -
vue-cli与nuxt在客户端中应用环境变量
小伙伴们在业务中肯定或多或少用的项目变量(像这种process.env.NODE_ENV),我么可以根据环境变量来区分开发环境以及进行一系列判断操作,玩意但要知道process是node存在的环境对象,在客户端是不存在这玩意的,那万一我想在例如.vue等客户端文件用呢咋办,别急,vue-cli跟nuxt这些都给我们提供了个好方法:vue-cli客户端应用环境变量以下是摘自官网的介绍:这么说...原创 2020-04-30 16:27:19 · 745 阅读 · 0 评论 -
你知道 !function () {}() 啥意思吗
童鞋们,你们是否有时候会看到函数前面加个!号的情况呢,你是否有疑问这!号是干啥的? 非 的意思? 不不不,如果你也有同样的疑惑我建议你来看看首先你看下面这个:function foo() {}这只是一个函数声明。您将需要一个调用foo来运行该函数运行该函数(好像是句废话)现在,当我们添加看似无害的感叹号:!function foo(){}时,它将变成一个表达式。现在它是一个函数表达式。...原创 2020-04-29 22:48:13 · 490 阅读 · 0 评论 -
Js文件遍历
文件遍历可谓是比较高频的应用场景,给定一个文件夹,把里面的所以文件遍历出来然后进行其他操作。例如打包后把dist文件夹的静态资源上传到cdn,查询某个文件夹是否存在名为xxx的文件等等。这里介绍的是利用递归的遍历:const getFiles = filePath => { let files = [] //遍历的文件全push进这个数组,方便后续操作(记住,push进去的是文件路径,...原创 2020-04-26 22:59:42 · 3062 阅读 · 3 评论 -
vue-element-ui 中 form resetFields并没有清空表单
问题背景vue-element-ui 中 form中有个清空表单的方法,即假如给表单一个ref='form', 则清空表单的方法为this.$refs['form'].resetFields()可当我在dialog组件中用这个方法的时候,这就出现问题了,居然清空不了~~~~~问题所在问题的本质是因为你编辑时,第一次打开dialog的时候给表单绑定的form赋值了,这时候这个form的初始值...原创 2019-12-26 15:26:19 · 2338 阅读 · 2 评论 -
Error: Content placeholder not found in template
最近鼓捣vue ssr,一开始就遇到个问题1、如要往一个html渲染内容,那就要在文档里放个占位符,不然人家咋知道必要插在哪里例如有个这东西: app想把内容渲染进body里面,那要在放一个标志位,就是 <!--vue-ssr-outlet-->一开始没加这个直接爆错Error: Content placeholder not found in ...原创 2019-12-02 11:28:31 · 1784 阅读 · 3 评论 -
解决npm安装报错问题: MSBUILD : error MSB3428: 未能加载 Visual C++ 组件“VCBuild.exe”
问题背景拉取项目代码,首先自然是npm install, 安装到一半给我报这个:简直看的我一脸懵逼,去搜了一下,原来是缺少了window构建工具(所以这是个啥???)不管了,安装了再说:解决办法以管理员身份打开终端命令行工具:一行代码:npm install --global --production windows-build-tools注意:存储空间要预留够,不然会安装失败...原创 2019-11-04 15:31:30 · 2458 阅读 · 0 评论 -
NPM包发布时报错code E401
写了个eslint插件想发布到npm上,执行npm publish,报错了:原因是没登录npm,其实原因很简单,想发布个东西总得让人家知道你是谁吧,好的,现在解决问题只需要两步。步骤一:从淘宝源切到npm源, 记得之后要切回淘宝源npm install -g nrm或者用这个方法:npm config set registry=http://registry.npmjs.org ...原创 2019-10-14 02:03:07 · 7398 阅读 · 0 评论 -
正则检验输入只能是数字或小写字母
很入门级的东西,但还是比较实用,经常用得到,如表单校验经常会规定输入只能是某一特定类型内容,如只能是数字或小写字母,可以这样写:var reg = /^[0-9a-z]*$/大家可以举一反三呀呀呀呀~~~...原创 2019-09-20 00:23:25 · 1822 阅读 · 2 评论 -
Charles mock数据时出现404报错的解决方法
背景最近在学react,尝试用Charles来模拟后台数据,这样也省的又去编写后台,对于前后端分离中对于我们前端mock数据比较方便。但用的时候却出错辽~~~~问题按照一些教程,我下载完Charles后事是这样配置的:点击Tools下的map local setting,然后配置如下:local path是映射到本地的文件的路径,即我们需要mock的数据就放在该路径下那理论上本地想访...原创 2019-09-09 00:07:19 · 2133 阅读 · 0 评论 -
div等非input 元素实现placeholder效果
代码html <div class="ques_edit" contenteditable="true" >css.ques_edit { width: 580px; height: 165px; margin:30px auto 20px; background: #eef4fe; text-...原创 2019-08-30 10:59:20 · 318 阅读 · 0 评论 -
inquirer.js -- 命令行交互工具
背景在一次需求中,要求利用命令行批量选择要打包的目录名称,于是乎我认识了inquirer.js, 极为友好及便捷的用户与命令行交互工具。inquirer.js主要功能有:提供错误反馈问问题解析输入验证答案管理分层提示安装npm install inquirer基本使用var inquirer = require('inquirer');inquirer .prom...原创 2019-08-18 02:45:02 · 1030 阅读 · 0 评论 -
node之crypto模块
crypto作用crypto模块的目的是为了提供通用的加密和哈希算法MD5和SHA1MD5是一种常用的哈希算法,用于给任意数据一个“签名”。这个签名通常用一个十六进制的字符串表示:const crypto = require('crypto');const hash = crypto.createHash('md5');// 可任意多次调用update():hash.update('...原创 2019-07-08 01:34:48 · 417 阅读 · 0 评论 -
解决执行git-pull 命令出现fatal: refusing to merge unrelated histories错误的问题
本地文件想上传到gtihub,在github上已建立仓库,没有采取git clone先拉取仓库文件,而是想直接添加远程仓库提交,在git-init之后,执行了 git remote add origin + 仓库地址,设定远程仓库后执行git add . , git commit -m"" 均无问题,执行git push时提示如下图:原来是远程仓库跟本地仓库内容不一致啊,想来也对,远程仓库还有个...原创 2019-07-03 16:50:55 · 6768 阅读 · 2 评论 -
npm备忘
备忘:清除npm缓存 npm cache clean --force重新安装npm npm i npm -g删除文件夹,比如node_modules,直接删除文件夹太深,直接使用命令行 rm -rf node_modules(亲测快很多)rm-rf:这个命令曾造成很多删库血案,令人闻风丧胆,因为这个命令实在是过于强大,rm是删除文件夹,包括文件夹里面的内容。rf 是指不用经过用户确认....原创 2019-07-10 01:29:51 · 92 阅读 · 0 评论 -
koa路由模块
koa路由使用基本步骤var Koa = require('koa');var Router = require('koa-router');var app = new Koa(); //实例化koavar router = new Router(); //实例化路由router.get('/', (ctx, next) => { //编写接口 // ctx.router a...原创 2019-07-13 22:59:48 · 185 阅读 · 0 评论 -
node之fs模块用法
导入fs模块var fs = require("fs")以下方法均为异步方法,都要异步函数及返回,如需用同步方法,即阻塞版本,无返回,在方法名后加Sync代表同步,如fs.unlink()的同步函数为fs.unlinkSybc(’…’)如unlink同步版本:同步版本模板//同步版本-->形成阻塞无返回值fs.unlinkSync('./dir1/test.js');创建文件...原创 2019-07-04 19:03:59 · 211 阅读 · 0 评论 -
防止文件上传重复算法
需求背景最近有个需求是这样的~~~公司某个平台有上传素材功能,,很多时候会上传重复素材,这样一来就带来不少问题,比较严重的就是浪费存储空间以及使素材库过于臃肿不利于查找,需求很自然的提了出来,在上传素材时判断该素材是否已经在数据库中,即使名字不一样。恰好看到七牛云公布的哈希算法,感觉尚可,那就拿来一用,各部分功能已添加注释代码// 计算文件的eTag,参数为buffer或者readable...原创 2019-07-15 18:24:26 · 1380 阅读 · 0 评论 -
打包react报错:Uncaught Invariant Violation: Minified React error #200;
问题在学习react时,尝试打包react的jsx语法文件,但报错了,如下:Uncaught Invariant Violation: Minified React error #200; visit https://reactjs.org/docs/error-decoder.html?invariant=200 for the full message or use the non-m...原创 2019-07-20 01:03:42 · 4687 阅读 · 1 评论 -
轻量的处理时间和日期的js库 -- day.js
day.js - - - 一个轻量的处理时间和日期的 JavaScript 库很多时候,我们会遇到各种需求把时间处理成不同形式,这时候如果自己编写js处理,可能效率有点慢,不妨用下这个库安装npm install dayjs --save引入 // CommonJS var dayjs = require('dayjs'); //ES6 import dayjs fro...原创 2019-07-22 16:45:36 · 318 阅读 · 0 评论 -
git拉取指定分支到本地
假设事先已拉取主分支创建本地分支git branch + 分支名称切换到分支git checkout + 分支名 拉取分支代码git pull origin + 分支名称原创 2019-08-08 01:32:08 · 1391 阅读 · 0 评论 -
flutter笔记
1、flutter包管理依赖包及相关配置在pubspec.yaml文件里,YAML是一种直观、可读性高并且易于阅读的文件格式想要安装flutter依赖包,首先在pubspec.yaml里面添加依赖包名称及版本号,然后执行命令:flutter packages get 这样就把依赖包安装好了...原创 2019-08-06 09:19:07 · 119 阅读 · 0 评论 -
关于vue-router全局前置守卫中beforeEach()里的代码循环执行的问题
问题背景几乎有登陆功能的站点都会有这一种流程: 用户想评论,点赞等有用户信息的行为站点如果检测到用户还没登陆,就会跳到登陆页进行登陆。而vue-Router中的全局前置守卫可谓十分适宜做这个功能,即beforeEach()钩子函数。按着这理解,我写下了以下代码;import Vue from 'vue'import Router from 'vue-router'import QuiArr...原创 2019-08-26 00:50:18 · 4601 阅读 · 0 评论 -
vue里的$attrs
$attrs官网介绍关于$attrs, vue官网如是介绍:包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何 prop时,这里会包含所有父作用域的绑定 (class 和 style 除外),并且可以通过 v-bind="$attrs"传入内部组件——在创建高级别的组件时非常有用。$attrs大白话介绍attr...原创 2019-08-22 02:29:23 · 4644 阅读 · 3 评论 -
node之process模块
process是什么process是nodejs中的全局对象,不需要require进来,就可以直接使用,获取进程信息操作进程获取当前工作目录process.cwd() 或process.env.pwd__dirname输出结果如图:获取文件绝对位置console.log(__filename)触发警告 参数格式:process.emitWarning(warning...原创 2019-07-07 18:46:54 · 551 阅读 · 0 评论