- 博客(16)
- 收藏
- 关注
RSS订阅原创 webpack打包工具
loader** html-loader**：处理html文件，将html文件内的外链当做依赖引入入口文件。** css-loader**：处理css文件，将css文件内容整合进入口文件中。style-loader：创建type标签，将入口文件中的整合css插入标签，将标签插入html文件。less/sass-loader：将less/sass文件转译为css文件。url-loader：处理图片资源，它是基于file-loader而来的，使用时要同时下载。...
2020-11-11 10:43:27
236
原创 react-router遇到的坑
1.嵌套路由不能配合<Route />组件的exact属性使用，因为父组件路由不匹配导致其不会渲染，自然而然的子组件路由就匹配不到，导致出现空白页2.嵌套路由不能配合<Redirect />组件使用，重定向会导致路由的重匹配，因为要匹配子组件的路由，就一定会匹配到父组件的路由，匹配到父组件路由之后，又会导致重定向，这样就会导致死循环...
2020-09-25 17:10:57
288
原创 Vue的templeta编译
1.template模板经过compiler编译产生render函数和AST2.编译器由createCompiler函数产生，在parse方法内使用正则匹配的方式解析template字符串
2020-09-09 17:18:27
197
原创 从源码角度解析Vue重排与重绘
众所周知，Vue通过数据绑定来修改视图，当某个数据被修改的时候，set方法会让闭包中的Dep调用notify通知所有订阅者Watcher，Watcher通过get方法执行vm._update(...)，进而去更新视图。在vm._update(...)中，Vue会调用patch(...)(vdom/patch.js第659行左右)，将新产生的vnode与数据未变更之前的旧的prevVnode进行对比。在patch(...)方法中，Vue通过sameVnode(...)(vdom/patch.js第42行左
2020-08-14 15:18:41
1246
原创 使用Vue时踩过的坑
1.当你创建一个Vue组件时，Vue提供了很多的选项，例如data、methods等等，当选项或选项值要求一个函数时，不要使用箭头函数，箭头函数会导致this绑定丢失，不再指向Vue实例。
2020-07-31 14:49:30
83
原创 react函数式组件与类组件
函数式组件拥有独立的变量和状态，函数式组件只是返回一个 React Element。类组件的属性都是挂载到实例之上的
2020-07-27 17:39:18
420
原创 在vue-cli或react脚手架中使用css预编译语言
使用vue-cli创建的项目，若要使用less，只需要下载less和less-loader即可，不需要变更webpack配置npm i less [email protected] -Sless-loader的版本不能过高，要不会出错
2020-07-15 11:49:13
223
原创 非阻塞式I/O与事件循环
我们首先要明确两点：1、Node是多线程的JS运行环境，JS代码运行在主线程上2、Node中有很多不同类型的观察者，例如I/O观察者、网络请求观察者，这些观察者负责监听不同类型的事件，它们会不停取出可用的请求对象，执行请求对象上挂载的回调函数。请求对象：从JS发起调用到内核执行完成I/O操作的过渡过程中，有一种中间产物贯穿其中，它就是请求对象，请求对象由操作系统API产生。理想的非阻塞I/O模型是：1、应用层发起异步调用之后立即交还主线程，用以继续执行JS代码；2、当系统内核完成数据获取后，会以
2020-07-01 19:23:38
244
原创 node的模块实现
node的模块实现很大程度的参考了CommonJS规范，例如使用 require(...) 引入模块，使用module.exports、exports抛出模块这里的exports其实就是module.exportsnode中的模块主要分为三类：核心模块(fs、path、http...)，文件模块，自定义模块(第三方依赖)核心模块：核心模块在node源代码编译过程中就被编译为二进制代码了，查找核心模块不需要路径分析文件模块：以 . .. / 开始的标识符，都会被当做文件模块解析，其实就是我们自己书写的
2020-06-29 23:54:48
97
原创 客户端渲染与服务端渲染
客户端渲染：客户端发送请求，获取到基本的HTML页面，然后通过ajax二次发送HTTP请求获取数据，将数据挂载到页面中服务端渲染：在服务器上使用模板引擎(例如art-template)，将数据渲染到HTML文档上，当客户端发送请求是，服务器返回给客户端的是已经挂载了数据的HTML文档，因此客户端不再需要通过ajax发送二次请求来获取数据服务端渲染可以被爬虫抓取到，有利于 SEO 搜索引擎优化；客户端异步渲染很难被爬虫抓取客户端渲染可以减轻服务器压力；服务端渲染由于需要对模板进行渲染，会导致服务端压力增
2020-06-29 23:48:57
88
原创 vue自定义事件与组件传值
在vue中，除了click、mouseleave ...等原生事件，vue还支持自定义事件。自定义事件应该分为三步：1、声明自定义事件2、监听自定义事件3、触发自定义事件在vue中，声明和监听自定义事件被合为一个步骤，即使用$on(eventName,callback)同时声明和监听；触发事件则使用$emit(eventName[,...arg])，...arg是传递给监听回调callback的参数列表组件传值分为三种：父子、子父以及兄弟父子传值：父子传值较为容易，只需在父组件内为子组件标签
2020-06-29 19:39:55
1399
原创 Vue的渲染函数
在vue中，我们可以通过三种方法来创建虚拟DOM：el，template，renderel 的值是一个在Vue实例之外定义的模板，将模板的 id 当做值传递给 el，在编译时，Vue会使用 Vue.compile(...)自动将对应的模板转换为 render 函数，进而渲染出虚拟DOM；template 的值是字符串—— html 形式的字符串，其编译过程与 el 相同；render 的值是一个函数，该函数的返回值是一个通过 createElement(...) 创建的虚拟DOM；三者中的两者或
2020-06-27 17:43:16
186
原创 Vue生命周期
beforeCreated： 当这个钩子函数被触发时，Vue实例刚刚初始化，data内property还没有挂载到实例对象上，所以Vue的响应式系统 Watcher 内还未添加属性created：当这个钩子函数被触发时，data内的property已经挂在到Vue实例上，即是说 Watcher 内已经挂在了响应式数据，但是模板尚未渲染beforeMounted：当这个钩子函数被触发时，虚拟DOM结构已经构建出来，但是 Watcher 还没有将响应式数据渲染到对应位置mounted：当这个钩子函数...
2020-06-23 23:49:14
59
原创 深入vue的响应式原理
在了解Vue的响应式原理之前，建议先去了解一下观察者模式(Observer)在Vue中，将状态机data挂载到Vue实例上的过程分为两步：1、遍历data对象获取property2、通过ES5的 Object.definedProperty(…) 方法将data的propoty转换成 setter/getter 的形式，挂载到Vue 实例上。在Vue中，每一个Vue实例都拥有一个 Watcher(观察者) 对象，当视图使用了Vue实例上的数据property时，会触发getter方法，
2020-06-22 23:12:49
94
原创 关于vuex的个人见解
vuex包括五大核心配置项：state、getter、mutations、action、modulegetter选项和Vue对象的computed配置项的用法一样，一般用于处理需要大量计算的属性
2020-06-22 22:10:52
109
原创 对vue-router以及导航守卫的理解
vue-router是vue框架的一个插件，主要处理路由的跳转，其返回值是一个构造函数，接收一个描述对象作为参数，描述对象有一个必选属性routes——一个由route配置对象组成的数组，其余选项均为可选，具体参考官网API。route配置对象包括很多选项：path: string, //匹配路由component?: Component, //匹配路由成功时要渲染的组件标识name?: string, // 命名路由，一般配合<keep-alive>使用components?: {
2020-06-21 19:47:43
312
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人