Vuex的学习笔记一:认识Vuex和引入,前端面试简历

72 阅读4分钟

文末

如果30岁以前,可以还不知道自己想去做什么的话,那30岁之后,真的觉得时间非常的宝贵,不能再浪费时间在一些碎片化的事情上,比如说看综艺,电视剧。一个人的黄金时间也就二,三十年,不能过得浑浑噩噩。所以花了基本上休息的时间,去不断的完善自己的知识体系,希望可以成为一个领域内的TOP。

同样是干到30岁,普通人写业务代码划水,榜样们深度学习拓宽视野晋升管理。

这也是为什么大家都说30岁是程序员的门槛,很多人迈不过去,其实各行各业都是这样都会有个坎,公司永远都缺的高级人才,只用这样才能在大风大浪过后,依然闪耀不被公司淘汰不被社会淘汰。

269页《前端大厂面试宝典》

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目,涵盖了初中级前端技术点。

前端面试题汇总

JavaScript

开源分享:docs.qq.com/doc/DSmRnRG…

Vuex的好处:

  1. 集中管理共享的数据,易于开发和后期维护;

  2. 能够高效的实现组件之间的数据共享,提高开发效率;

  3. 存储在Vuex的数据是响应式的,能够实时保持页面和数据的同步;

看下图对比项目中不使用Vuex共享数据和使用Vuex的区别:

在这里插入图片描述

从上图中可以看到,不使用Vuex的项目,通过父子和兄弟之间传值实在太麻烦,看着眼都花了,更何况还要用代码来实现,肯定不好开发和维护;再看看使用Vuex的项目,只需要把组件需要共享的数据保存到Vuex中,别的组件需要可以直接获取,不需要第三方中介,一目了然,便于开发和维护;

3.Vuex的基本使用

安装Vuex依赖包

npm install vuex --save

导入包

import Vue from 'vue'

import Vuex from 'vuex'

Vue.use(Vuex)

创建store对象

const store = new Vuex.Store({

state: {

},

mutations: {

},

actions:{

},

getters: {

}

})

将store对象挂载到vue的实例中

new Vue({

el: '#app',

render: h => h(app),

router,

//将创建的共享数据对象挂载到vue的实例中,所有的组件就可以直接从store中获取全局的数据了

store

})

这样一个项目就成功引入了vuex了,后面我们再一起学习怎么在项目中使用Vuex来进行组件间数据的获取和修改!

文末

如果30岁以前,可以还不知道自己想去做什么的话,那30岁之后,真的觉得时间非常的宝贵,不能再浪费时间在一些碎片化的事情上,比如说看综艺,电视剧。一个人的黄金时间也就二,三十年,不能过得浑浑噩噩。所以花了基本上休息的时间,去不断的完善自己的知识体系,希望可以成为一个领域内的TOP。

同样是干到30岁,普通人写业务代码划水,榜样们深度学习拓宽视野晋升管理。

这也是为什么大家都说30岁是程序员的门槛,很多人迈不过去,其实各行各业都是这样都会有个坎,公司永远都缺的高级人才,只用这样才能在大风大浪过后,依然闪耀不被公司淘汰不被社会淘汰。

269页《前端大厂面试宝典》

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目,涵盖了初中级前端技术点。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端面试题汇总

JavaScript