![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
面向高阶
文章平均质量分 73
小小liang
一个在深圳捡破烂的前端
展开
-
vue之常用的辅助函数mapState、mapMutations、mapActions
目录vue之常用的辅助函数mapState、mapMutations、mapActions![在这里插入图片描述](https://img-blog.csdnimg.cn/5c527abc4144434281d33e6789ce03b5.png#pic_center)store / modules / about.jsstore / mutation-type.jsAbout.vue vue之常用的辅助函数mapState、mapMutations、mapActions store / modules /原创 2021-11-25 17:42:02 · 250 阅读 · 0 评论 -
vue之mixin的使用
目录vue之mixin的使用mixin之中的data数据访问mixin / index.jsHome.vueAbout2.vue vue之mixin的使用 作用:在引入组件之后,则是将组件内部的内容如data等方法、method等属性与父组件相应内容进行合并。相当于在引入后,父组件的各种属性方法都被扩充了 data数据的等访问原则:若是使用mixin的当前组件有该 data数据 或者 methods方法的话 直接运用的是当前组件的数据或者方法,否则的话直接继承mixin内部的数据与方法 mixin之中的原创 2021-11-24 17:36:36 · 902 阅读 · 0 评论 -
vue源码系列4之虚拟dom和真实dom
目录vue源码系列4之虚拟dom和真实domcompiler / index.jsinit.jslifecycle.jsindex.jsrender.jsvnode / index.jsvnode / patch.js vue源码系列4之虚拟dom和真实dom 流程: // 判断用户是否 传入了render , 没传入时,可能传入了template。template没有传入时候,就拿最外面的 <div id="#app"></div>作为模板 // 将我们的html ->原创 2021-11-18 22:15:39 · 1061 阅读 · 2 评论 -
vue源码系列3之 render函数 与 模板编译 与生成ast树结构
目录vue源码系列3之 render函数 与 模板编译init.jscompiler / index.js vue源码系列3之 render函数 与 模板编译 init.js 当对vm实例对象数据初始化后,则想对应的需要针对视图模板进行渲染(挂载-编译-渲染等步骤) 首先先判断是否有挂载模板 - el vm.$options.el 如果有挂载el 模板 ,那么需要针对el模板进行data数据的勾连 其中Vue.prototype.$mount作用为 使得数据与模板进行挂钩 在data数据渲染之前,需要先原创 2021-11-11 21:05:29 · 781 阅读 · 0 评论 -
vue源码系列之 响应式数据处理2 数组的重写
目录 vue源码系列之 响应式数据处理2 数组的重写 array.js 对数组的方法进行重写 oldArrayPrototype 原始的数组方法 arrayMethos = Object.create(oldArrayPrototype) 创建一个新的对象,也就是拷贝原始数组的方法 methods 中的方法,是会影响原始数组的,因此需要重写这些方法 遍历这些会改原始数组的方法,然后执行步骤是 先执行自己定义的arrayMethos 方法,之后再调用原始数组的方法 其中最主要的是:假如args传入的实参原创 2021-11-08 21:46:11 · 1126 阅读 · 3 评论 -
vue源码系列之 响应式数据处理
目录vue源码系列之 响应式数据处理index.htmlsrc / index.jssrc / init.jsstate.jsobserve / index.js vue源码系列之 响应式数据处理 index.html 创建一个Vue实例对象,并且传入一个对象 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Comp原创 2021-11-04 21:51:31 · 215 阅读 · 0 评论 -
vue之$nextTick(callback)
目录vue之$nextTick(callback)作用vue之$nextTick(callback)源码 vue之$nextTick(callback)作用 this.$nextTick(callback) 作用:处理vue中的dom异步更新,粗暴的说就是dom渲染之后,就会执行callback函数 <template> <div> <div ref="msgRef">about1 {{ msg }}</div> <button原创 2021-09-30 20:18:10 · 400 阅读 · 0 评论 -
面向高级之webpack4基础1
目录面向高级之webpack基础1安装nvm与node–save-dev || -D 与 --save || -S的区别简单初始化项目之基础配置webpack4之基础2 webpack.config.js配置0:mode的模式1:enter的使用方式 - 打包的入口2:output打包的出口3:loader加载器 - scss - less 预编译处理器等处理 es6等语法转化解析ES6对react语法的解析4:plugin插件 - 面向高级之webpack基础1 安装nvm与node nvm 的安装原创 2021-09-26 21:39:11 · 118 阅读 · 0 评论