- 博客(24)
- 收藏
- 关注
原创 Axios设置全局拦截器
import axios, { AxiosRequestConfig, AxiosResponse } from 'axios';import { Message } from 'element-ui';import router from '../../router';axios.interceptors.request.use(function (config: AxiosRequestConfig): AxiosRequestConfig | Promise<AxiosRequestCo.
2020-08-17 13:52:46
791
原创 vue 根据路由元信息控制页面内容的展示
在路由元中定义不同的路由需要加载不同的模块生成计算属性在页面中用v-if或者v-show(看情况)来控制组件的展示情况把所有的主页面放在一级的router-view中,而不是把页面整体放在一级router-view,菜单栏显示的内容放在二级router-view。这样的好处是:如果整体页面在一级router-view菜单栏里的详情内容在二级router-view,而二级router-view中的页面部分也需要全屏显示,这时候就只能吧二级页面中的内容放在一级的router-view
2020-08-17 13:47:21
1311
原创 从输入url到页面展示出来都发生了什么--浏览器加载页面过程
1.DNS解析域名解析,如www.baidu.com我们知道这是百度首页的网址,但是电脑是不认识他的,电脑只能根据IP地址去访问百度的服务器,所以第一步要做的就是把域名解析成IP地址浏览器首先会查找浏览器自身的缓存,若有则直接访问,若没有则查看系统的缓存,有则访问,没有就去路由器查。。。就这样直到查到顶级ISP一定会找到。2.三次“握手”建立TCP连接client和sev...
2019-08-13 16:08:59
123
原创 js深浅拷贝
浅拷贝用ES6语法实现是相当简单的function shadowClone(target){ return {...target}}深拷贝 function deepClone(target){ let result = Array.isArray(target) ? [] : {}; for(let key in target)...
2019-08-10 21:08:39
109
原创 css3立方体
主要是用了过渡和动画<div class="wrapper"> <div class="box"></div> <div class="box"></div> <div class="box"></div> ...
2019-08-10 15:13:50
98
原创 浏览器跨域
NodeJS中设置响应头允许跨域前端部分,简单的封装一个promise版的ajaxlet myAjax = (function (){ return function ({path, method="GET", body={}, headers={}}){ return new Promise(function (resolve, reject){ ...
2019-08-07 17:17:41
223
原创 递归函数优化--尾递归
铺垫函数的调用会在内存中形成一个调用记录,也称作“调用帧”,用来保存调用位置和内部变量等信息。内存中用一个栈结构来保存调用帧,也称“调用栈”。函数被调用时调用帧入栈,函数返回时调用帧弹栈。当发生函数的嵌套时,如在A函数中调用B函数,就会有连续的两个调用帧入栈function A(){ ... B(); ...}当B函数返回时,B调用帧弹栈,继续执行A函数...
2019-08-04 14:03:11
253
原创 vuex的简单使用
什么是vuex?Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。具体的说,就是把组件的共享状态抽离出来,以一个全局单例模式管理,这就是vuex什么时候使用vuex?多个视图依赖同一个状态 来自不同视图的行为需要变更同意状态vuex核心概念statestate里面存储着所有的共享状态,也就是需要被多个组件所共享的数据,从store中读取状态最简单的方法就...
2019-07-28 10:51:27
92
转载 对MVVM模型的理解
这篇文章很详细https://blog.csdn.net/u014346301/article/details/53812770
2019-07-26 17:08:14
151
转载 vue双向数据绑定原理
Vue是采用数据劫持结合发布/订阅模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。MVVM入口函数,相当于new Vue()Observer数据监听器,也就是观察者,能够对数据对象的所有属性进行监听,如果数据变化,就可以拿到新值并通知订阅者Dep负责管理所有的订阅者Com...
2019-07-26 09:46:27
65
转载 BFC块格式上下文
创建BFC根元素或包含根元素的元素 浮动元素:float不为none(float+float具有包裹性和破坏性导致无法自适应,一般用在块状浮动布局) 绝对定位元素:position不为static或者relative(absolute脱离文档流) overflow 值不为 visible 的块元素(overflow可自适应,但由于溢出不可见限制了应用场景) 行内块元素:display为...
2019-07-24 16:17:50
149
原创 双飞翼布局和圣杯布局
双飞翼布局html部分 <div class="container"> <div class="col main-wrap"> <div class="main"></div> </div> <div cl...
2019-07-23 17:34:51
97
转载 instanceof和typeof
instanceof用法 A instanceof B官方说法是用于测试构造函数的prototype(B)属性是否出现在对象(A)的原型链的任何位置,即constructor.prototype(A)是否存在于object(B)的原型链function Animal(head, feet, tail){ this.head = head this.feet ...
2019-07-21 10:12:47
118
原创 document.ready和w_indow.onload
window.onload网页中所有元素完全加载到浏览器后执行,即JavaScript可以访问网页中的所有元素window.onload = function (){ //do something}document.ready在DOM完全加载之后执行$(document).ready(function (){ //do something})//简写...
2019-07-20 21:43:01
112
转载 AJAX优缺点
优点局部刷新传统的数据交互,哪怕只是很少的数据也要重新加载整个页面,ajax可以做到局部刷新,只刷新数据变化部分异步ajax的全称是 Asynchronous JavaScript And XML (异步的js和xml),很明显他的一大优点就是异步,浏览器会另启一个线程来完成数据交互工作界面与应用分离Ajax使WEB中的界面与应用分离(也可以说是数据与呈现分离),有利于分工合作、...
2019-07-20 14:38:15
71
原创 前端优化
减少http请求 小于1kb的图片使用base64编码,直接嵌在html中 使用精灵图csssprite 合并js, 合并css 优化js、css 使用CDN 浏览器对每个域名的并发请求数量有限制,所有使用CDN可以增大并发请求数量 请求CDN不许要携带cookie,节省空间 CSS放在header标签里,使其尽早下载,有些浏览器需要下载完所有的c...
2019-07-18 15:57:03
63
原创 盒模型
盒模型分为两种 标准盒模型和IE盒模型标准盒模型标准盒模型就是W3C所规定的,元素的width属性的作用范围只包括盒子的content区域.box{ height: 80px; width: 80px; padding: 5px; border: 5px solid black; margin: 5px;}在标准盒模型中,width...
2019-07-18 08:33:48
59
原创 npm更改全局默认路径和国内镜像
1.新建一个文件夹,我的是 E:\node2.在node文件夹下新建两个文件夹 node_cache 和 node_modules3.打开cmdnodejs会自动把全局模块安装到 E:\node\node_modules4.添加环境变量新建环境变量 NODE_PATH 值就是你的node_modules路径5.测试全局安装webpack安...
2019-07-16 10:05:29
851
原创 Node 连接mongoDB数据库及简单的增删改查
1、连接数据库之前,一定要先打开mongoDBmongod -config i:\db.conf我把配置文件放在了i:\db.conf里2、连接mongoDBconst mongoose = require('mongoose')//加载mongoose模块mongoose.connect('mongodb://localhost/test')//连接数据库,表明为test,...
2019-04-01 20:36:57
205
转载 JavaScript严格模式
严格模式主要有以下限制。变量必须声明后再使用 函数的参数不能有同名属性,否则报错 不能使用with语句 不能对只读属性赋值,否则报错 不能使用前缀 0 表示八进制数,否则报错 不能删除不可删除的属性,否则报错 不能删除变量delete prop,会报错,只能删除属性delete global[prop] eval不会在它的外层作用域引入变量 eval和arguments不能被重...
2019-03-26 20:37:43
186
原创 for...in和for...of
1、for...infor...in可以迭代对象的可枚举属性遍历对象时,先顺序遍历对象的以数字为键的属性,然后是顺序遍历以字符为键的属性,而且访问的是属性名let obj = { 1 : 1, a : 2, 2 : 3, fn : function (){}, b : 4}for(let item in obj){ console....
2019-03-24 10:22:37
145
原创 结合webpack使用vue-router
目录结构main.jsimport Vue from '../node_modules/vue/dist/vue.js'import VueRouter from '../node_modules/vue-router'//导入vueimport app from './App.vue'import account from './main/Account.vue'impor...
2019-03-20 22:51:06
150
原创 webpack中使用vue
先安装一波插件npm i vue-loader vue-template-compiler -D在webpack.config.js中配置.vue后缀的匹配规则const VueLoaderPlugin = require('vue-loader/lib/plugin');modules.exports = { plugins : [ new VueL...
2019-03-20 21:28:42
96
原创 webpack使用
1、基本文件目录2、初始化npm init -y3、安装jquerynpm install jquery -s-s是写入dependencies,即生产环境4、在main.js中导入jquery,并编写jquery代码import $ from 'jquery'$(function (){ $('li:odd').css('backgroundColo...
2019-03-19 10:52:41
137
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人