![](https://img-blog.csdnimg.cn/20210411181629633.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue解析
文章平均质量分 83
vue内部源码解析以及常用方法介绍
首展噼里啪啦前端团队
这个作者很懒,什么都没留下…
展开
-
通过生命周期梳理vue组件化流程
初始化流程new Vue从 new Vue 开始作为入口,Vue 只是一个简单的构造函数。function Vue (options) { this._init(options)}进入了 _init 函数之后,先初始化了一些属性。initLifecycle:初始化一些属性如:$parent$children根实例没有 $ parent,parent,parent, $children 开始是空数组,直到它的 子组件 实例进入到 initLifecycle 时,才会往父组件的 $原创 2021-12-29 10:43:35 · 644 阅读 · 0 评论 -
Vue-浅析换肤
应产品的要求,做人生中的第一次换肤项目,在没做之前,确实觉得挺没有头绪的,所以就只能借助于百度啊,然后发现其实element自带的就有换肤功能,虽然看了很多别人的文章,但是想自己写一下加深印象。一、项目搭建第一步肯定是根据命令行生成对应的项目框架,然后安装element,根据需求引入自己需要的element组件最后拿到的效果图如下:二、换肤思路搭建好了项目以后,最重要的问题就来了,如何实现换肤呢。其实主要的还是依赖于element里面的知识:vue , e...原创 2021-04-20 21:00:42 · 180 阅读 · 0 评论 -
Vue Test Utils
单元测试(unit testing),是指对软件中的最小可测试单元进行检查和验证。在提供了经过测试的单元的情况下,系统集成过程将会大大地简化。开发人员可以将精力集中在单元之间的交互作用和全局的功能实现上,而不是陷入充满很多Bug的单元之中不能自拔。流行框架1. jestJest是一个由facebook开发的测试运行器,内置Jsdom、断言库和mock,vue-test-utils 官网评价 jsdom 由纯javascript实现的一系列 web标准,特别是 WHATWG(Web ...原创 2021-04-20 20:58:31 · 1527 阅读 · 0 评论 -
vue项目详情页返回列表,记录之前信息
需求场景:我们在开发后台管理系统的时候,经常会遇到这样的问题,我刚通过筛选条件筛选出来了一批数据,然后我点击到了第二页,点击进入了对应数据的详情页,查看完数据后,返回列表,这个时候之前筛选的信息不见了,页码也回到了第一页;这个时候如果需要再筛选,再重复操作的话,这样的体验是非常差的,很浪费时间;最好的体验是:我去详情之前是怎样的页面,详情返回后就是怎样的页面,保留之前的筛选条件、列表数据、分页信息等,甚至刷新也都保存之前的筛选条件;但是如果我从其他模块进入,我希望筛选条件等是清空的,从第一页开始;原创 2021-04-20 14:54:59 · 879 阅读 · 0 评论 -
【实用】整理常用的vue自定义指令
“vue自定义指令实例。”自定义指令参数详解: bind:只调用一次,指令第一次绑定到元素时调用,可以定义一个在绑定时执行一次的初始化动作 inserted:被绑定元素插入父节点时调用 update:被绑定元素所在的模板更新时调用,但是可能发生在其子 VNode 更新之前 componentUpdated:指令所在组件的 VNode 及其子 VNode 全部更新后调用 unbind:只调用一次,指令与元素解绑时调用 1、v-focus 元素获得..原创 2021-04-14 19:07:57 · 274 阅读 · 0 评论 -
Vuex源码解析二之API
“Vuex数据的存储、读取源码解读。”数据读取读取state中的数据get state () { return this._vm._data.$$state}function resetStoreVM (store, state, hot) { // ... store._vm = new Vue({ data: { $$state: state // 此处传入的state是`root state` }, computed: comp..原创 2021-04-12 22:06:52 · 450 阅读 · 0 评论 -
Vuex源码解析之store初始化
“ 我们知道,vuex是一个专门为vue.js设计的状态管理器。它可以集中存储所有组件的状态,让兄弟组件或多层嵌套组件之间的传值变得简单。vuex以全局单例模式管理着所有组件的状态和一些触发状态变化的行为,本篇从源码上详解vuex是如何设计这个store单例,也就是store类实例化的过程。”下面看一个最简单的例子:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Stor原创 2021-04-11 18:35:04 · 1471 阅读 · 0 评论