- 博客(18)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Vue-router 笔记
Vue-Router 笔记使用import Vue from 'vue';import Router from 'vue-router';Vue.use(Router);const router = new Router({ config });new Vue({ router, render: h => h();}).$mount('#app');// vue.beforecreate// <router-view></rou...
2021-04-13 17:20:03
174
原创 Vue源码笔记
Vue 源码笔记使用import Vue from 'vue';new Vue({ render: h => h(component), // router}).$mount('#app');Vue 实例initDatafunction initData { let data = vm.$options.data // 组件复用，不为函数，实例保持同一个对象的引用，导致数据污染 data = vm._data = typeof data === 'functio
2021-04-10 21:25:09
131
原创 Vue 双向绑定
这里写自定义目录标题抛砖_Vue响应源码响应式流程图代码实现参考抛砖_Vue响应源码响应式流程图代码实现class Vue { // Vue 构造类 constructor(options) { this._data = options.data; observer(this._data); // 新建一个Watcher观察者对象，这时候Dep.target会指向这个Watcher对象 // 源代码中, ./instance/index.js->st
2021-03-10 15:26:48
117
原创 Js 六种继承方式
/** js 继承方式 * 参考来源 JavaScript 高级程序设计(第3版) 6.3 继承 */// 父类function Father(name) { this.name = name; // 被所有子实例共享 this.firuts = [];}Father.prototype.sayName = function() { console.log...
2019-08-18 00:01:42
136
原创 webpack搭建vue开发环境
前言本文只是个人笔记，记录关于webpack的粗浅知识，内容可见多数文章。一、webpack 的基本概念Entry：指定webpack开始构建的入口模块，从该模块开始构建并计算出直接或间接依赖的模块或者库；Output：告诉webpack如何命名输出的文件以及输出的目录；Loaders：由于webpack只能处理javascript，所以我们需要对一些非js文件处理成webpa...
2019-06-19 21:11:43
225
原创 随笔小记_2019.03
7、容灾概述容灾系统是指相隔较远的异地，建立两套或多套功能相同的IT系统，互相之间可以进行健康状态监视和功能切换，当一处系统因意外停止工作是，整个系统可以切换到另一处，使得该系统功能可以继续工作。容灾技术是系统高可用性技术的一个组成部分，容灾技术是高可用性技术的一个组成部分，容灾系统更加强调处理外界环境对系统的影响，特别是灾难性事件对整个IT节点的影响，提供节点级别的系统恢复功能。...
2019-06-05 23:52:31
116
原创 event、dom 位置信息
本文所有属性信息，均在chrome环境下。一、测试dom<!DOCTYPE html><html lang="zh"><head> <style rel="stylesheet"> body{ margin: 0; } .event{ width: 200px; heigh...
2019-06-05 20:06:36
160
原创 随笔小记_2019.05
2019.056、避免 “ cannot read property of undefined ” 错误技巧例如：favorites.reading.magazines[0] (数据结构比较深)或单元const favoriteBook = ((favorites.reading||{}).books||[])[0];try/catchconst tryFn...
2019-06-04 17:21:51
195
转载 深入理解浏览器的缓存机制
转载：深入理解浏览器的缓存机制作者：浪里行舟一、前言缓存可以说是性能优化中简单高效的一种优化方式了。一个优秀的缓存策略可以缩短网页请求资源的距离，减少延迟，并且由于缓存文件可以重复利用，还可以减少带宽，降低网络负荷。对于一个数据请求来说，可以分为发起网络请求、后端处理、浏览器响应三个步骤。浏览器缓存可以帮助我们在第一和第三步骤中优化性能。比如说直接使用缓存而不发起请求，或者发起了请...
2019-05-30 22:57:36
188
转载 常见六大 Web 安全攻防解析
转载：https://mp.weixin.qq.com/s/qjsGvK1tQedR2qCv2triHQ前言在互联网时代，数据安全与个人隐私受到了前所未有的挑战，各种新奇的攻击技术层出不穷。如何才能更好地保护我们的数据？本文主要侧重于分析几种常见的攻击以及防御的方法。一、XSSXSS（Cross-Site Scripting），跨脚本攻击，因为缩写和css重叠，所以只能叫XSS。跨...
2019-05-16 19:34:57
1091
原创 vue e2e 测试
1、vue e2e测试概述e2e 测试端对端测试，属于黑盒测试，通过编写测试用例，自动化模拟用户操作，确保组件间通信正常，程序流数据传递如预期。典型 e2e 测试框架对比名称 断言 是否跨浏览器支持 实现 官网 是否开源 nightwatch assert和 chai expect 是 selenium http://ni...
2019-04-18 11:24:13
6279
原创 vue单元测试笔记
1、vue单元测试工具/框架概述vue test utilsvue test utils 通过将组件隔离挂载，然后模拟必要的输入 ( prop、注入、用户事件) 和对输出 (渲染结果、触发的自定义事件) 的断言来测试Vue组件。vue-test-utils 链接：https://vue-test-utils.vuejs.org/zhkarma 基于 node 的 js 测试...
2019-04-17 14:36:47
642
原创 多屏适配笔记
关于前端屏幕适配方案这块，目前主要使用过以下6个方案：1、rem通过js根据当前设备屏幕宽度，动态计算元素长度单元。var html = document.getElementsByTagName('html')[0];var pageWidth = html.getBoundingClientRect().width;html.style.fontSize = pageWid...
2019-04-11 14:49:13
207
原创 vue-router进阶笔记
开发过程中只使用过vue-router的导航守卫做权限，路由元信息做导航激活，其他知识点没有接触过，写个笔记加深理解。1、导航守卫可以用router.beforeEach注册一个全局前置守卫，可以根据需求，根据权限拦截页面跳转，或跳转会指定页面，比如登录页面。router.beforeEach((to, from, next) => { // logic judgmen...
2019-04-11 00:30:56
172
原创 vue element-UI Upload 笔记
实现图片上传前预览功能，element-UI Upload 组件绑定 on-change函数,触发事件后没有 file.url 属性，一、解决：let blob=file.raw;let blobUrl=URL.createObjectURL(blob);this.formData.monitorPic = blobUrl;URL.createObjectURL()方法目前在...
2019-03-23 00:14:45
143
转载 祝你不幸并痛苦
“通常，毕业典礼的演讲嘉宾都会祝你们好运并送上祝福。但我不会这样做让我来告诉你为什么。”Now the commencement speakers will typically also wish you good luck and extend good wishes to you. I will not do that, and I’ll tell you why.“在未...
2019-03-19 14:12:32
283
原创 Referrer策略与防盗链
碰到后端提供图片链接不可访问，添加<meta name="referrer" content="no-referrer">后可以显示。referrer：http请求header的报文头，指明http请求从哪个页面链接过来的。referrer策略：no referrer：任何情况都不发送Referrer信息；no referrer when downgrade：仅当...
2019-03-05 23:20:49
1080
原创 前端布局笔记
前端入门一年多，项目全靠div解决，布局这块了解太少了，归纳下前端布局。归纳前端五大布局：静态布局、自适应布局、流式布局、响应式布局、弹性布局，及静态布局中两栏、三栏布局等。一、静态布局静态布局就是传统web，不管设备尺寸变化，网页布局不变。二、自适应布局自适应布局就是元素位置变化，大小尺寸不变。三、流式布局流式布局与自适应布局相反，元素大小变化，位置不变。四、响应...
2019-02-15 15:06:28
258
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人