- 博客(30)
- 收藏
- 关注
RSS订阅原创 vue通信，原理，杂谈
computed和watchcomputed计算属性依据data值改变，如果data没有改变，直接从缓存中取值有缓存，依赖data改变，才会重新计算不支持异步，有异步操作，无法监听数据变化一对一或多对一computed属性值为函数（自身），会走get方法，数据变化调用set方法（当前属性变化），watch不支持缓存，数据变化直接发生改变支持异步两个参数，第一个为newValue，第二个是oldValue监听data或者props数据immediate组件加载立即执行，deep深
2021-04-09 10:57:34
214
原创 http总结
同源策略web浏览器允许第一个页面的脚本访问第二个页面里的数据，但是也只有在两个页面有相同的源时。源是由URI，主机名，端口号组合而成的。这个策略可以阻止一个页面上的恶意脚本通过页面的DOM对象获得访问另一个页面上敏感信息的权限。（相同的协议，主机，端口）http://www.example.com/dir/page.htmlhttp://www.example.com:81/dir/other.html 不同源，端口不同https://www.example.com/dir/other.html
2021-04-09 10:55:36
200
原创 vue-route的用法
vue-router 两种模式SPA单页面应用，顾名思义，但也没，加载页面不会加载整个页面，更新某个容器内内容，更新视图不请求页面，在vue中，vue-router用来实现hash模式先看官网介绍：vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。类似于服务器路由，通过匹配不同的url路径...
2020-04-10 17:00:38
3406
原创 computed和watch区别与用法
什么是computed先来看官方文档：计算属性： 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护，在这个地方，模板不再是简单的声明式逻辑。你必须看一段时间才能意识到，这里是想要显示变量 message 的翻转字符串。当你想要在模板中多次引用此处的翻转字符串时，就会更加难以处理。所以，对于任何复杂逻辑，你都应当使用计算属性。...
2020-04-09 16:34:26
2001
1
原创 vuex源码分析
什么是vuex先来看官方介绍： Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能vuex是mcv模式中的model...
2020-04-07 17:46:46
392
原创 关于vscode智能提示失效问题
在vscode使用react插件之后，只能提示失效把光标放在js文件中，import 引入包的时候，提示正在加载初步判断为自动关联，导致缓存包在自身node_module和c盘缓存node_module之间无法自动判断导致卡死经过google发现： 将类型声明下载到的C:\Users\MyUserName\AppData\Local\Microsoft\TypeScript\3.0\...
2019-12-30 09:50:32
3054
转载 一万小时剖析
随着畅销书《异类》的流行，“练习一万小时成天才”这个口号现在是尽人皆知。也许仍然有不少人相信那些不世出的天才必有天生的神秘能力，但科学家通过大量的调查研究已经达成共识，那就是所有顶级高手都是练出来的。不但如此，最近几年的科学进展，人们可能第一次拥有了一个关于怎样炼成天才的统一理论。好消息是除了某些体育项目对天生的身高和体型有特殊要求之外，神秘的天生素质并不存在，也就是说人人都有可能成为顶级高手。...
2019-12-17 11:15:56
242
1
原创 vue中webpack 配置的注释
什么是webpackWebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Sass，TypeScript等），并将其转换和打包为合适的格式供浏览器使用。在3.0出现后，Webpack还肩负起了优化项目的责任。其最主要的就是三点：打包，转换，优化webpack 配置 module.exports = {...
2019-06-12 16:50:11
909
2
原创 重绘与重排
什么是重绘和重排重绘就是重新绘制（repaint）重排就是重新排列（reflow）DOM发生改变的时候触发重排，使DOM重新排列，重绘不一定会重排，但是重排一定发生重绘，重绘和重排都会耗费浏览器的性能，尽量避免网页如何生成解析html绘制DOM树解析css绘制CSS树生成render tree（渲染树）flow排列，将渲染树节点合成（渲染）paint绘制，将排列绘制在屏幕上（...
2019-01-10 15:27:15
6747
原创 vue中Mixins 与 Hoc
什么是mixins在官方文档中混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。// 定义一个混入对象var myMixin = { created: function () { this.hello() }, methods: { he...
2019-01-10 15:25:55
1479
原创 跨域全解，看这个就够了
为什么要跨域由于浏览器同源策略，限制同一个源加载文档与另一个源进行交互，用来隔离恶意的攻击。如果没有同源策略限制会导致针对接口：在登录上使用cookie来判断是谁发送的请求，服务器验证响应头加入set-cookie，下次请求时候，浏览器自动将cookie附在http请求头字段cookie，如果没有同源策略，其他网站可以使用你的cookie登录你的账号。（CSRF攻击）但是即使有同源策略coo...
2018-11-08 11:27:46
228
原创 缺省协议和浏览器缓存
缺省协议/缺省协议的使用，代表资源访问的协议和当前页面保持一致，如果页面是http，//就代表http，如果页面是http，也是如此。许多cdn也是如此，//是缺省协议的写法//jb51.net/css/缺省协议的优缺点本地调试时候，协议为文件协议（file://）；这样这个文件就不存在；浏览器的缓存为了节省网络资源的加速浏览，浏览器在用户磁盘对最近请求过的文档进行存储，再次请求...
2018-11-07 17:38:40
433
原创 vue 构造函数---vue源码解析（3）
介绍使用vue时候，要先new操作符调用，说明Vue是一个构造函数，所以我们首先要把vue的构造函数搞清楚Vue构造函数的原型npm run dev"dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev",调用scripts/config.js // Runtime+compiler deve...
2018-11-02 18:11:34
1175
原创 箭头函数详解
箭头函数与普通函数不同1：箭头函数不能使用new2：箭头函数不能使用arguments，使用 rest参数 …var a = (...A)=>{ console.log(A)}3:箭头函数指向先看一个栗子var obj = { a:10, b()=>{ console.log(this.a); //underfined ...
2018-11-01 18:01:25
587
原创 call，apply，bind
函数的三种角色length 形参的个数name：函数名prototype：类的原型，在原型上定义方法都是当前类实例的公有方法_proto:把函数当成普通对象，指向Function类的原型function Fn(){ var num = 500; this.x = 100;}Fn.prototype.getX = function(){ console.lo...
2018-11-01 14:50:56
122
原创 什么是AMD，CommonJS，UMD（2）
模块规范JS组件生态系统稳步增加，但是组件之间互相引入导致组件混乱，为了解决问题，互为对手的AMD和CommonJS出现，他们可以让开发者在约定的沙箱以模块化的形式编写自己的代码。AMD 异步模块定义RequireJS目前是现在最流行的实现方式例如foo模块依赖于jquery// filename: foo.jsdefine(['jquery'], function ($) {...
2018-10-30 17:59:57
638
原创 vue源码探究---读vue技术揭秘（1）
需要了解RollUpFlowRollUpRollup是一个js的模块打包器，可以将小块代码编译成大块复杂代码，那为什么这样做呢，为了降低开发问题时候的复杂度Tree-shaking（摇树优化）除了使用ES6的模块外，Rollup还能静态分析代码中的import// 使用 ES6 import 语句导入(import) ajax 函数import { ajax } from '...
2018-10-30 17:58:36
759
原创 数据类型与es6 复习
之前做一个项目，老是不系统了解，年底做完了，总结一下 参考：es6小技巧 数据类型1：数据类型六种 es6增加了第七种symbol 数值number 字符串 string 布尔值 boolean undefined 未定义 null 空值 对象 object 数值，字符串，布尔值 为原始类型 对象为合成类型对象又分三个子类型 对象 obje...
2018-02-11 09:57:33
156
原创 vue 组件与通信与vuex与computed与生命周期（2）
二：vuex先看官方文档Vuex 官方文档：https://vuex.vuejs.org/zh-cn/ vuex 是一个专为vue应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 vuex 不同于localstorage，刷新之后vuex中的state数据就会丢失 所以vuex只能用于单页面之间不同组件数据流...
2018-02-09 17:53:24
3065
原创 vue 组件与通信与vuex与computed与生命周期（1）
一：组件1：先看官方文档——–什么是组件组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用 is 特性进行了扩展的原生 HTML 元素。所有的 Vue 组件同时也都是 Vue 的实例，所以可接受相同的选项对象 (除了一...
2018-02-09 16:58:49
1552
原创 webpack 二次总结
前言：在6月份的时候写了一个关于vue-cli的webpack探究，当时似懂非懂，现在回过头来，感觉还是欠缺不少，这次看了技术胖的博客，感觉受益匪浅 技术胖博客1:webpack介绍webpack 模块打包机 目的:分析你的目录接口，找到JavaScript模块以及其他一些浏览器不能直接运行的拓展语言，将其打包和转换为合适供浏览器使用的格式。webpack还有优化功能 打包：多个
2018-02-01 01:26:57
240
原创 node.js学习(3)
一：网络操作1：简介通过node.js可以编写服务端的程序协助前端和测试，还需要http协议和socket协议var http = require(‘http’); http.createServer(function(request,response){ response.writeHead(200,{‘Content-Type’:’text-plain’});
2018-01-23 11:18:26
217
原创 node.js学习（2）
node.js 模块学习学习一门新语言，就要学习它的api。（ps：这笔记其实早写好了，前几天做个h5，没时间排版，等h5结束了，再总结。）1：nodejs 文件操作node.js不只是能做网络编程，还能操作文件 基本api(1)小文件拷贝var fs = require(‘fs’); function copy(src,dst){ fs.writeFil
2018-01-19 18:37:46
134
转载 年终总结之数组
今天看到了一篇文章，关于数组的，想想年终了，总结下自己所学的文章地址：数组总结1：创建数组var colors = [];var colors = ['red','blue'];var arr = new Array();var arr2 = new Array(10);var arr3 = new Array(5,4,3,2,1)2:检测数组if(
2018-01-16 09:55:35
211
原创 node.js学习（1）
之前用koa2+mysql，和koa2+mongodb仿过一个多人博客论坛和个人博客，但对于node还是感觉没有入门，所以就有了下面的博客。 本文参考了七天学会node.js，算了做笔记了 链接：七天学会node.js node.js中文api文档：api文档1:node.js目的：高性能node.js的web服务器。 优点：事件机制和异步IO模型，js本身不自带IO功能，
2018-01-15 17:54:16
140
原创 call和apply用法
一直都知道call和apply，用的真的很少，今天想起来了，就随便说说吧1:基本用法看到call和apply，大家想到的应该都是一句话 改变对象执行的上下文2：apply和call的用法其实call和apply的用意简单来说都一样，就是改变this 的指向这也是他们的相同点下面看一个具体的demovar person = { name: 'xiao m
2018-01-15 11:56:00
211
原创 vue-cli 遇到的问题
1：切换子路由时，数据不刷新，在子路由进入时，观察watch代码： watch:{ '$route'(to,from){ const toDepth = to.path.split('/').length const fromDepth = from.path.split('/').length console.l
2017-09-07 10:21:24
230
原创 js 10元买酒
10元买5瓶酒，2个盖子换一瓶，4个瓶子换一瓶，最多换多少个。 下面贴代码function compute(yuan){ var num = yuan/2; var jiu = num; var gai = num ; var ping = num ;var total = num; console.log(num,total) recompute(); funct
2017-06-16 00:58:28
306
原创 webpack入门
webpack已经出来很久了，以前就接触过，但是没有系统的学习，现在已经有了webpack2，本文基于webpack1，下面是段webpack的基本代码//一个常见的Webpack配置文件var webpack = require('webpack');var HtmlWebpackPlugin = require('html-webpack-plugin');var ExtractTextP
2017-06-14 22:08:45
246
原创 jquery bind用法
bind介绍 bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。语法 `$(selector).bind(event,data,function) event 必须。添加到元素的一个或多个事件如：click,mouseover,mouseup，change，select data 可不填。传递到函数的额外数据，如：$(select
2017-02-13 13:36:52
515
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人