only家的博客-CSDN博客

原创 Eggjs Sequelize 多表关联查询

写服务端的新手，我们项目用nodejs写服务端，框架是egg.js。对于简单的增、删、改、查新手的我也是快速上手了，但是当我遇到需要关联其他表查询时，我就懵逼了，不知道怎么关联啊。几经周折，总算搞明白了，特此记录一下~~~实现：通过 fdc_vd_user_his 表关联外键，查询 fdc_vd_user_page 表及 fdc_pro_user_project 表数据模型：fdc_vd_user_pagefdc_pro_user_projectfdc_vd_user_his

2020-07-03 16:35:50 4345 1

原创 egg-multipart配置mode,同时支持stream和file类型

我们知道，egg-multipart中支持的类型只有两种：stream和file，通过配置中的mode字段来控制。当你的工程里只需要一种类型就很好办了，需要什么mode配成什么就OK啦。但是，我最近就倒霉了，我的模块本来是支持file类型的，没问题，我配成了file。但是过段时间发现我的模块出问题了，苦苦寻觅，原来是有同事的另一个模块需要stream类型，结果他改了我先前的配置文件，从mode:file改成了mode:stream改了就算了，还不改完整，只顾自己不顾他人，你们说是不是

2020-06-30 19:55:13 1724

原创 Egg.js报错：Reach fields limit或Reach fieldSize limit

作为一个前端开发，今年才开始接触用nodejs写服务端，我们用的是eggjs。其中有一些问题，想要记录一下。我们有个需求是需要提交图片和其他配置信息，之前测试的都是配置信息比较少的情况，今天突然遇到一个很复杂的配置信息，结果提交就报错了。413：Reach fieldSize limit搜了一些文章说的都是：Reach fields limit，是不是很像，但是不一样啊。后来看了官网配置，依葫芦画瓢，重新配置fieldSize就好啦，如果是Reach fields limit错误就重新配置field

2020-06-30 19:43:21 1004

原创 javascript常见数据类型判断

1、typeof类型判断在web开发中有非常广泛的应用。说到类型判断，首先会想到的是typeof，引用《JavaScript权威指南》中对typeof的介绍：typeof是一元操作符，放在其单个操作数的前面，操作数可以是任意类型。返回值为表示操作数类型的一个字符串。在ES6前，JavaScript共有六种数据类型：Boolean、Number、String、Undefined、Null...

2019-11-26 11:16:44 269

原创 new 的模拟实现

1、MDN 对 new 运算符的描述：new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。new 关键字会进行如下操作：创建一个空的简单的 JavaScript 对象（即 {}）；链接该对象（即设置对象构造函数）到另一个对象；将步骤1新创建的对象作为 this 的上下文；如果该函数没有返回对象，则返回 this ；看个例子：function Person...

2019-11-25 15:18:16 319 1

原创 vuex的简单使用和网页刷新vuex中state数据丢失的解决方案

最近在用vue写PC端的后台管理系统，涉及到系统操作员信息和权限的管理。以前很暴露的把一些信息都存到了sessionStorage中，就是为了完成功能，没考虑太多安全方面的问题。如今也不算是刚入门的前端小白了吧，这么直接存session太不应该了，就稍微改进了一下。看官网文档有store模式，可以管理各个页面组件共享的数据（状态）。不过我最后使用了vuex，这个专为vue设计的状态管理模式。无论用...

2019-11-21 14:52:07 847

原创前端面试关于cookie、session、HTTP

1、cookie和session的区别session是基于cookie实现的，cookie保存在客户端浏览器中，而session保存在服务器上。如果说cookie机制是通过检查客户身上的“通行证”来确定客户身份的话，那么session机制就是通过检查服务器上的“客户明细表”来确认客户身份。session相当于程序在服务器上建立的一份客户档案，客户来访的时候只需要查询客户档案表就可以了。区别：...

2019-11-06 16:01:13 567

原创跨域

1、什么是同源策略？同源策略是浏览器中一项基本的安全策略，是指从一个源中加载的文档或脚本与来自不同源的资源之间的交互会被浏览器所限制。同源策略中的同源指的是，协议、域名、端口均相同。比如：https://www.csdn.net/index.html 这个网站，协议是https，域名是www.csdn.net，端口是80（默认端口）。它的同源情况如下：https://www.csdn.net...

2019-11-05 11:16:22 124

原创 Vue响应式原理

Vue最独特的特性之一，是其非侵入性的响应式系统，数据模型仅仅是普通的JavaScript对象，而当你修改它们时，视图会进行更新，这使得状态管理非常简单。接下来就讲讲Vue响应式系统的原理。1、如何追踪变化当一个Vue实例创建时，Vue会遍历data选项（你传入的普通JavaScript对象）中的所有属性，并使用Object.defineProperty把它们转化为getter/setter，...

2019-10-30 11:31:52 176

原创 Vue生命周期

1、什么是Vue生命周期？Vue实例从开始创建到销毁的过程就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载DOM——>渲染、更新——>渲染、销毁等一系列过程，我们称之为Vue生命周期。2、Vue生命周期的作用是什么？在生命周期的过程中会运行一些叫做生命周期钩子的函数，这给了我们在不同阶段添加自己代码的机会，使得我们可以更好地控制Vue实例。3、生命周期总共有几个阶段？...

2019-10-29 18:06:04 147

原创 javascript事件循环Event Loop

js Event Loop学习笔记。1、线程和进程的区别一个程序至少有一个进程，一个进程至少有一个线程。线程的划分尺度小于进程，使得多线程程序的并发性高。另外，进程在执行过程中拥有独立的内存单元，而多个线程共享内存，从而极大的提高了程序的运行效率。线程在执行过程中与进程还是有区别的，每个独立的线程有一个程序运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行，必须依存在应用程序中，...

2019-10-23 18:21:10 224 2

原创 JavaScript事件

博客总结笔记，关于JavaScript事件。1、js事件流上图为js事件流的全过程，从图中可以得知：一个完整的事件流是从window开始，最后回到window的一个过程。事件流分为三个阶段，1-5是捕获阶段，5-6是目标阶段，6-10是冒泡阶段。默认情况下，js事件是在冒泡阶段执行的。...

2019-10-23 11:29:59 647

原创原生JS实现bind

在JavaScript中有很多改变this指向的方法，如call、apply，本文说的bind也是方法之一，与前两者不同的是，前两者改变this指向的时候会立即执行，而bind不会。bind是函数原型Function.prototype上的一个方法，作用是改变this的指向并返回一个函数等待执行。bind可以传入多个参数，第一个参数作为this的一个对象，后面的参数作为返回函数的形参。第一个参...

2019-10-12 15:40:19 339

原创 CSS预处理器

1、CSS预处理器定义CSS预处理器是基于CSS的一种语言，通过工具编译成CSS，添加了很多CSS不具备的特性，能提升CSS文件的组织方式。2、常见的CSS预处理器有1、less：基于node.js2、sass：基于ruby，也有node版本3、CSS预处理器的作用1、能够更好的组织CSS代码2、提高代码复用性3、提高代码可维护性4、CSS预处理器的优缺点1、优点：提高代码复用...

2019-10-10 18:02:04 906

原创 BFC(块格式化上下文)

1、概念BFC（block formatting context）块格式化上下文是web页面的可视化css渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素交互限定的区域。2、创建BFC1、根元素或包含根元素的元素2、浮动元素（元素float不为none）3、绝对定位元素（元素position为absolute或fixed）4、行内块元素（元素display为inli...

2019-10-10 16:05:00 106

原创 CSS盒模型

1、概念盒模型组成由里到外：content、padding、border、margin盒模型有两种标准：标准盒模型、IE盒模型从上面两图可以看出，标准盒模型的宽高是content的宽高。IE盒模型的宽高包括：content宽高+padding+border2、CSS如何设置两种模型使用css3的box-sizing属性：/*设置为标准盒模型*/box-sizing:conten...

2019-10-10 12:49:04 119

原创 ES6学习笔记之变量的解构赋值——字符串的新增方法

1、String.fromCodePoint()ES5提供String.fromCharCode()方法，用于从Unicode码点返回对应的字符，但是这个方法不能识别码点大于0xFFFF的字符。ES6提供了String.fromeCodePoint()方法，可以识别大于0xFFFF的字符，弥补了String.fromCharCode()方法的不足。在作用上，与codePointAt()方法相反。...

2019-09-16 17:40:31 181

原创 ES6学习笔记之变量的解构赋值——解构赋值的用途

1、交换变量的值：let x=1;let y=2;[x,y]=[y,x];2、从函数返回多个值：函数只能返回一个值，如果要返回多个值，只能将它们放在数组或对象里返回。有了解构赋值，取出这些值就非常方便了。如下：//返回一个数组function example(){ return [1,2,3];}let [a,b,c] = example();//返回一个对象functi...

2019-09-12 14:44:34 181

原创 ES6学习笔记之变量的解构赋值——对象的解构赋值

解构不仅可以用于数组，还可以用于对象。对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。let { bar, foo } = { foo: 'aaa', bar: 'bbb' };foo // "aaa"bar // "bbb"let { baz } = { foo: 'aaa', bar: '...

2019-09-12 12:01:19 261

原创 ES6学习笔记之变量的解构赋值——数组的解构赋值

终于决定好好看看ES6了。笔记还是要有的吧。一、数组的解构赋值变量的解构赋值：ES6按照一定模式从数组和对象中提取值，对变量进行赋值，这被称为解构赋值。下面是几个例子：let [foo,[[bar],baz]]=[1,[[2],3]];foo //1bar //2baz //3let [x,,y]=[1,2,3]x //1 y // 3let [head,...tail]=[1...

2019-09-12 10:52:22 205

原创 JavaScript经典题目之作用域、闭包

1、数组newArray中有哪些元素？ var array = []; for (var i = 0; i < 3;i++) { array.push(() => i); } var newArray = array.map(el => el()); console.log(newArray);答案是：3,3,3如果要记...

2019-08-15 17:16:17 297

原创 JavaScript经典题目之变量声明提升、全局作用域、函数作用域

作为一名前端开发，JavaScript简直重要的不行，保持学习的状态。记录一些我觉得需要被记录的东西。1、下面的代码在控制台会输出什么？var a = 10;function test() { console.log(a);//？？？ var a = 20; } test();答案是会打印出：undefined解析：使用var声明的变量在JavaScript中...

2019-08-14 12:21:32 189

原创 Vue项目多地IP地址部署，后台配置动态IP

前端代码部署到用户本地，打包部署之后，后台以部署地的服务器ip为ip。我是直接通过在index.html文件（此文件项目打包不会的时候不会被打包）中设置一个全局的window对象的IPconfig属性来实现的（用户只需设置一下IP地址为部署地服务器IP）。当然，网上有单独新建一个config文件的方式。index.html:window.IPConfig = { 'ba...

2019-08-07 10:34:44 4079

原创限制input输入框的输入字符个数，区别中英文字符

input输入框自带maxlength，但是无论是中文还是英文字符都算1。我们项目中要求的是中文字符算2个长度，英文字符算1一个长度。且我的是vue项目，需要实现双向数据绑定。经过一番研究得出下面的方法实现，暂时看来应该没问题。在此记录。项目中使用的是elementUI库，为了输入框与elementUI保持一致，加上class：el-input__inner使用@input实时监听输入框内容改...

2019-07-30 17:05:23 2756

原创 vue面试题

一、React 和 Vue 相同点：1、使用 Virtual DOM；2、提供了响应式 (Reactive) 和组件化 (Composable) 的视图组件；3、将注意力集中保持在核心库，而将其他功能如路由和全局状态管理交给相关的库；二、React 和 Vue 不同点：1、性能vue和React的性能都非常高。优化：在 React 应用中，当某个组件的状态发生变化时，它会以该组件为根...

2019-07-17 12:41:47 746

原创 Vue、elmentUI国际化 vue-i18n项目实行简繁体切换

1、安装国际化插件vue-i18nnpm install vue-i18n --save2、增加国际化翻译文件在项目的src下添加lang文件夹增加中文简体翻译文件（zh-cn.js）以及繁体翻译文件（zh-mo.js），里面分别存储项目中需要翻译的内容。增加index.js实现按需加载里定制 i18n。index.js:import Vue from ‘vue’import V...

2019-05-23 14:23:43 4363

原创 elementUI修改navMenu带有二级菜单的title样式

在vue项目中使用了elementUI的navMenu的横向菜单，需要修改菜单的高度，默认是60px，要求是50px。给所有的 el-menu-item 标签修改了样式，唯独带有二级菜单的，样式就应用不上去。二级菜单是使用slot添加的，单独给这个slot添加样式，等渲染出来，样式却没有了。费了不少功夫，算是找到了解决方法。不知道全局引入样式有毛用，朋友说可以，但是我没有试。在此记录一下我的...

2019-04-29 09:41:20 7477 2

原创 vue项目在IE下出现空白

vue项目中遇到IE浏览器开发是空白页，并未按路由加载组件。原因Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及一些定义在全局对象上的方法都不会转码。解决这个问题，我们使用 Polyfill（代码填充，也可译作兼...

2019-04-25 09:44:15 2978

原创 vue.js全局函数

在项目组需要定义全局函数，在不同的组件需要使用。记录一下我的解决方法。第一步：创建js文件，文件里面放全局函数**（函数一定要export出去）**我的文件位置如下：js里面的函数：第二步：在main.js中全局import，如下：import { ObjKeySortAscii } from ‘./assets/js/objKeySortAscii.js’//签名字符串排序Vue....

2019-04-24 16:17:53 657

原创 vue.js定义全局变量

在此次VUE项目中需要使用到全局变量。在此记录一下我的解决方法。在main.js文件里面直接定义全局变量，如：//全局变量Vue.prototype.host = “http://195.164.5.11/yymicapi”;在组件中使用方法：this.host...

2019-04-24 16:03:40 1047

原创在Vue项目中使用md5加密

在vue项目中使用md5对签名字符串进行加密。使用md5的方法如下。一、在项目根目录下安装md5npm install --save js-md5二、在main.js或是项目文件中引入import md5 from ‘js-md5’;三、在项目文件中使用md5(_signStr)；...

2019-04-22 11:08:16 715

原创 vue请求后台接口跨域问题

在vue项目中通过axios请求后台接口，出现跨域问题。我的解决方法如下。在config/index.js中有个 “ proxyTable:{ } “ ,在里面添加代理规则如下：target: ‘http://’+接口的域名secure: false, // 如果是https接口，需要配置这个参数changeOrigin:true,// 如果接口跨域，需要进行这个参数配置注意： ‘...

2019-04-22 10:31:00 5003 1

原创 Vue中使用AES加密

后台管理系统项目中遇到需要对用户登录密码进行AES/ECB/PKCS7Padding加密，然后调用登录接口，传入密码，用户名。在此记录一下我的实现过程。第一步：安装crypto-js项目中执行 " npm install crypto-js --save-dev " ,安装crypto-js。第二步：项目中新建一个js文件，比如：utils.js （utils：工具集）第三步：uti...

2019-04-19 10:59:06 1712

原创 vue路由跳转，页面title随之变化

最近刚认真的学习和使用Vue2.0，有必要记录一下遇到的问题和相应的解决方法，给自己一个交代。## vue设置路由title，实现在vue路由发生变化的时候，相应的页面title随之变化使用vue-wechat-title插件来解决步骤：1、在项目根目录下打开命令行通过 “npm install vue-wechat-title --save” 来安装插件。2、在路由里面配置每个路由的地...

2019-04-08 14:38:06 2289

weixin_39066827的博客