最后:
总结来说,面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气,但是我们可以在别的地方花更多时间,每个环节都提前做好准备。
面试一方面是为了找到工作,升职加薪,另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚,更重要的是在平时学习和工作中不断积累和坚持,把每个知识点、每一次项目开发、每次遇到的难点知识,做好积累,实践和总结。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
安装:
npm install --save- vuex
引入:
import Vuex from ‘vuex’
import Vue from ‘vue’
Vue.use(Vuex)
Vuex 的组成部分
==========
完整的应用 Vuex 开发的应用结构应该是这样的:
vuex-complete
下面针对比较核心的部分进行说明。
State
=====
State 负责存储整个应用的状态数据,一般需要在使用的时候在根节点注入 store
对象,后期就可以使用 this.$store.state
直接获取状态
// store 为实例化生成的
import store from ‘./store’
new Vue({
el: ‘#app’,
store,
render: h => h(App)
})
这个 store 可以理解为一个容器,包含着应用中的 state 等。实例化生成 store 的过程是:
const mutations = {…}
const actions = {…}
const state = {…}
Vuex.Store({
state,
actions,
mutations
})
后续在组件中使用的过程中,如果想要获取对应的状态你就可以直接使用 this.$store.state
获取,当然,也可以利用 vuex
提供的 mapState
辅助函数将 state
映射到计算属性中去,如
// 我是组件
import {mapState} from ‘vuex’
export default {
computed: mapState({
count: state => state.count
})
}
这样直接就可以在组件中直接使用了。
Mutations
=========
Mutations
的中文意思是“变化”,利用它可以更改状态,本质就是用来处理数据的函数,其接收唯一参数值 state
。
store.commit(mutationName)
是用来触发一个 mutation
的方法。需要记住的是,定义的 mutation
必须是同步函数,否则 devtool 中的数据将可能出现问题,使状态改变变得难以跟踪。
const mutations = {
mutationName(state) {
//在这里改变state中的数据
}
}
在组件中触发:
//我是一个组件
export default {
methods: {
handleClick() {
this.$store.commit(‘mutationName’)
}
}
}
或者使用辅助函数 mapMutation
直接将触发函数映射到 methods
上,这样就能在元素事件绑定上直接使用了。如:
import {mapMutations} from ‘vuex’
//我是一个组件
export default {
methods: mapMutations([
‘mutationName’
])
}
Actions
=======
Actions
也可以用于改变状态,不过是通过触发 mutation
实现的,重要的是可以包含异步操作。其辅助函数是 mapActions
与 mapMutations
类似,也是绑定在组件的 methods
上的。如果选择直接触发的话,使用 this.$store.dispatch(actionName)
方法。
// 定义 Actions
const actions = {
actionName({commit}) {
//dosomething
commit(‘mutationName’)
}
}
总结
技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
ommit(‘mutationName’)
}
}
总结
技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
[外链图片转存中…(img-6p9zGgQM-1715507900753)]