精华内容
下载资源
问答
  • vuex面试题
    千次阅读
    2022-05-06 21:49:17

    一.vuex是什么?怎么使用?哪种功能场景使用它?

            Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。简单来说就是:应用遇到多个组件共享状态时,使用vuex。

    场景:多个组件共享数据或者是跨组件传递数据时,

    比如:单页应用中,组件之间的状态。音乐播放、登录状态、加入购物车

    怎么使用?

    vue框架中状态管理。在main.js引入store,注入。
    新建了一个目录store.js,…… export 。

    vuex的流程

            页面通过mapAction异步提交事件到action。action通过commit把对应参数同步提交到mutation,mutation会修改state中对应的值。最后通过getter把对应值跑出去,在页面的计算属性中,通过,mapGetter来动态获取state中的值

    二.vuex有哪几种属性?vuex的store有几个属性值?分别讲讲它们的作用是什么?

    有五种,分别是State , Getter , Mutation , Action , Module (就是mapAction)

    state => 基本数据(数据源存放地)
    getters => 从基本数据派生出来的数据
    mutations => 提交更改数据的方法,同步!
    actions => 像一个装饰器,包裹mutations,使之可以异步。
    modules => 模块化Vuex

    1. state:vuex的基本数据,用来存储变量

    2. geeter:从基本数据(state)派生的数据,相当于state的计算属性

    3. mutation:提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数,提交载荷作为第二个参数。

    4. action:和mutation的功能大致相同,不同之处在于 ==》1. Action 提交的是 mutation,而不是直接变更状态。 2. Action 可以包含任意异步操作。

    5. modules:模块化vuex,可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰,方便管理。

    三、vuex的state、getter、mutation、action、module特性分别是什么?

            state:存放公共数据的地方
      getter:获取根据业务场景处理返回的数据
      mutations:唯一修改state的方法,修改过程是同步的
      action:异步处理,通过分发操作触发mutation
      module:将store模块分割,减少代码臃肿

    四、页面刷新后vuex的state数据丢失怎么解决?

    放在localStorage 或者sessionStorage中 ,或者借用辅助插vuex-persistedstate。

    vuex-persistedstate的createPersistedState()方法

    五、使用vuex的优势是什么?

            作为全局变量来用;vue是单向数据流,有一个vuex来建一个”全局仓库“,可以减少很多开发时候的”传参地狱“。其实vuex中的所有功能都能够通过其他的方式进行实现,只不过vuex对这些方法进行了整合处理,使用起来更加便捷,同时也便于维护。

    六、vuex五种状态的特性是什么

    1、vuex 的 store 特性是什么
    vuex 就是一个仓库,仓库里放了很多对象。其中 state 就是数据源存放地,对应于一般 vue 对象里面的 data,state 里面存放的数据是响应式的,vue 组件从 store 读取数据,若是 store 中的数据发生改变,依赖这相数据的组件也会发生更新
    它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性
    2、vuex 的 getter 特性是什么
    getter 可以对 state 进行计算操作,它就是 store 的计算属性
    虽然在组件内也可以做计算属性,但是 getters 可以在多给件之间复用
    如果一个状态只在一个组件内使用,是可以不用 getters
    3、vuex 的 mutation 特性是什么
    action 类似于 muation, 不同在于:action 提交的是 mutation,而不是直接变更状态
    action 可以包含任意异步操作

    七、vue 中 ajax 请求代码应该写在组件的 methods 中还是 vuex 的 action 中?请求数据是写在组件的methods中还是在vuex的action中?

            如果请求的数据是多个组件共享的,为了方便只写一份,就写vuex里面,如果是组件独用的就写在当前组件里面。

    如果请求来的数据不是要被其他组件公用,仅仅在请求的组件内使用,就不需要放入 vuex 的 state 里

    如果被其他地方复用,请将请求放入 action 里,方便复用,并包装成 promise 返回

    八、怎么监听vuex数据的变化?

            先用计算属性、然后再监听

    九、vuex使用actions时不支持多参数传递怎么办?

    答:放在对象里面

    十、你觉得vuex有什么缺点?

    答:页面刷新时会使state的数据初始化

    十一、你觉得要是不用vuex的话会带来哪些问题?


    答:组件之间传值麻烦复杂

    • 可维护性会下降,你要修改数据,你得维护 3 个地方
    • 可读性下降,因为一个组件里的数据,你根本就看不出来是从哪里来的
    • 增加耦合,大量的上传派发,会让耦合性大大的增加,本来 Vue 用 Component 就是为了减少耦合,现在这么用,和组件化的初衷相背
       


    十二、vuex 原理

            vuex 仅仅是作为 vue 的一个插件而存在,不像 Redux,MobX 等库可以应用于所有框架,vuex 只能使用在 vue 上,很大的程度是因为其高度依赖于 vue 的 computed 依赖检测系统以及其插件系统,

            vuex 整体思想诞生于 flux,可其的实现方式完完全全的使用了 vue 自身的响应式设计,依赖监听、依赖收集都属于 vue 对对象 Property set get 方法的代理劫持。最后一句话结束 vuex 工作原理,vuex 中的 store 本质就是没有 template 的隐藏着的 vue 组件;

    十三、使用 Vuex 只需执行 Vue.use(Vuex),并在 Vue 的配置中传入一个 store 对象的示例,store 是如何实现注入的?

            Vue.use(Vuex) 方法执行的是 install 方法,它实现了 Vue 实例对象的 init 方法封装和注入,使传入的 store 对象被设置到 Vue 上下文环境的store中。因此在VueComponent任意地方都能够通过this.store 访问到该 store。

    十四、Vuex 如何区分 state 是外部直接修改,还是通过 mutation 方法修改的?vuex怎么知道state是通过mutation修改还是外部直接修改的?

    通过$watch监听mutation的commit函数中_committing是否为true;严格模式下不允许直接修改。

    Vuex 中修改 state 的唯一渠道就是执行 commit('xx', payload) 方法,其底层通过执行 this._withCommit(fn) 设置_committing 标志变量为 true,然后才能修改 state,修改完毕还需要还原_committing 变量。外部修改虽然能够直接修改 state,但是并没有修改_committing 标志位,所以只要 watch 一下 state,state change 时判断是否_committing 值为 true,即可判断修改的合法性。
     

    十五、vuex怎样赋值?vuex存储数据的方法有哪些?

    使用下面这两种方法存储数据:

      dispatch:异步操作,写法: this.$store.dispatch('actions方法名',值)

      commit:同步操作,写法:this.$store.commit('mutations方法名',值)

    十六.Vuex中如何异步修改状态

    actions与mutations作用类似,都是可以对状态进行修改。不同的是actions是异步操作的。

    actions是可以调用Mutations里的方法的。

    const actions={
    	addActions(context){
    		context.commit('add',10);//调用mutations中的方法
    		setTimeout(()=>{context.commit('reduce')},5000)
    	//	setTimeOut(()=>{context.commit('reduce')},3000);
    		console.log('我比reduce提前执行');
    	},
    	
    	reduceActions({commit}){
    		commit('reduce');
    	}
    }

    十七、Vuex中状态储存在哪里,怎么改变它?

    答:存储在state中,改变Vuex中的状态的唯一途径就是显式地提交 (commit) mutation。

    十八、Vuex中状态是对象时,使用时要注意什么?

    答:对象是引用类型,复制后改变属性还是会影响原始数据,这样会改变state里面的状态,是不允许,所以先用深度克隆复制对象,再修改。

    十九、怎么在组件中批量使用Vuex的state状态?

    答:使用mapState辅助函数, 利用对象展开运算符将state混入computed对象中

    import {mapState} from 'vuex' export default{ computed:{ ...mapState(['price','number']) } }

    二十、你有使用过vuex的module吗?主要是在什么场景下使用?

    答:把状态全部集中在状态树上,非常难以维护。按模块分成多个module,状态树延伸多个分支,模块的状态内聚,主枝干放全局共享状态

    二十一、vuex一个例子方法

    在testApp中建store文件 ==》 store文件下又有modules文件夹和getter.js 和 index.js ==》 store文件下建user.js

    在store文件下的index.js中引入

    import Vue from 'vue'
    import Vuex from 'vuex'
    import user from './modules/user'
    import global from './modules/global'
    import getters from './getters'
     
    Vue.use(Vuex)
     
    const store = new Vuex.Store({
      modules: {
        user
      },
      getters
    })
     
    export default store

     在store文件下的getters.js中引入

    const getters = {
      self: state => state.user.self,
      token: state => state.user.token,
      currentCommunity: (state, getters) => {
        let cid = getters.currentCommunityId
        return getters.communities.filter(item => {
          return item.communityId === cid
        })
      }
    }
     
    export default getters

    在modules文件下的user.js写代码

    const user = {
      state:{
          self: null,
          token: '',
      },
      mutations:{
          SET_SELF: (state, self) => {
               state.self = self
           },
           SET_TOKEN: (state, token) => {
               state.token = token
           }
      },
      actions:{
           login ({ commit }, res) {
                commit('SET_SELF', res.self)
                commit('SET_TOKEN', res.token)
          }
       }
    }
    export default user   

    更多相关内容
  • 官方文档 对vuex不太熟悉的小伙伴。可以先去看看vuex官方的文档: 提示 这是与 Vue 3 匹配的 Vuex 4 的文档。...下面是常见面试题: 1.vuex是什么?怎么使用?哪种功能场景使用它? Vuex 是一个专为 Vue..

     推荐文章:

     

    vue3面试题:最新vue3.0前端经典面试试题及答案(持续更新中……)_南北极之间的博客-CSDN博客打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%......使用Proxy代替defineProperty实现响应式重写虚拟DOM的实现和Tree-Shaking......Vue3可以更好的支持TypeScriptComposition API(组合API)setup配置ref与reactivewatch与watchEffectprovide与inject......新的内置组件FragmentTeleportSuspense其他改变新的生命周期钩子data 选项应始终被声明为一个函https://blog.csdn.net/qq_22182989/article/details/125781704

    VUE之VUEX常见面试题大全汇总--史上最全【vuex面试题】_勤动手多动脑少说多做厚积薄发-CSDN博客官方文档对vuex不太熟悉的小伙伴。可以先去看看vuex官方的文档:提示这是与 Vue 3 匹配的 Vuex 4 的文档。Vuex 是什么? | Vuexhttps://vuex.vuejs.org/zh/如果您在找与 Vue 2 匹配的 Vuex 3 的文档,请在这里查看。Vuex 是什么? | Vuexhttps://v3.vuex.vuejs.org/zh/下面是常见面试题:1.vuex是什么?怎么使用?哪种功能场景使用它?Vuex 是一个专为 Vue..https://blog.csdn.net/qq_22182989/article/details/122854506
    前端面试题之HTML+CSS(持续更新)_勤动手多动脑少说多做厚积薄发-CSDN博客1.行内元素和块级元素?img算什么?行内元素怎么转化为块级元素?行内元素:和有他元素都在一行上,高度、行高及外边距和内边距都不可改变,文字图片的宽度不可改变,只能容纳文本或者其他行内元素;其中img是行元素块级元素:总是在新行上开始,高度、行高及外边距和内边距都可控制,可以容纳内敛元素和其他元素;行元素转换为块级元素方式:display:block;2.将多个元素设置为同一行?清除浮动有几种方式?将多个元素设置为同一行:float,inline-block清除浮动的方式:方法一:添.https://blog.csdn.net/qq_22182989/article/details/106867530?spm=1001.2014.3001.5502

    2022最新Web前端经典面试试题及答案-史上最全前端面试题(含答案)、前端面试题大全、前端进阶必知必会知识点_勤动手多动脑少说多做厚积薄发-CSDN博客前端面试题汇总资料:需要资料的同学可以给我留言https://blog.csdn.net/qq_22182989/article/details/122451418?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522164446317716781683915410%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=164446317716781683915410&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~rank_v31_ecpm-9-122451418.nonecase&utm_term=%E9%9D%A2%E8%AF%95%E9%A2%98&spm=1018.2226.3001.4450
    2021前端开发最全vuejs面试题(持续更新)_勤动手多动脑少说多做厚积薄发-CSDN博客1、什么是MVVM?答:MVVM是是Model-View-ViewModel的缩写,Model代表数据模型,定义数据操作的业务逻辑,View代表视图层,负责将数据模型渲染到页面上,ViewModel通过双向绑定把View和Model进行同步交互,不需要手动操作DOM的一种设计思想。2、怎么定义vue-router的动态路由?怎么获取传过来的动态参数?答:在router目录下的index.js文件中,对path属性加上/:id。 使用router对象的params.id3、vue-router有哪https://blog.csdn.net/qq_22182989/article/details/106795502?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522164446317716781683915410%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=164446317716781683915410&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~rank_v31_ecpm-5-106795502.nonecase&utm_term=%E9%9D%A2%E8%AF%95%E9%A2%98&spm=1018.2226.3001.4450

    JS必看面试题_勤动手多动脑少说多做厚积薄发-CSDN博客2019JS必看面试题1. javascript的typeof返回哪些数据类型.答案:string,boolean,number,undefined,function,object2. 例举3种强制类型转换和2种隐式类型转换?答案:强制(parseInt,parseFloat,number)隐式(== ===)3. split() join() 的区别答案:前者是将字符串切割成数组的形式,后者是将数组转换成字符串4. 数组方法pop() push() unshift() shttps://blog.csdn.net/qq_22182989/article/details/106792847?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522164446317716781683915410%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=164446317716781683915410&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~rank_v31_ecpm-4-106792847.nonecase&utm_term=%E9%9D%A2%E8%AF%95%E9%A2%98&spm=1018.2226.3001.4450JavaScript数组的常用方法总结:遍历,复制,反转,排序,添加,删除(前端常见面试题必考必问)实例演示_勤动手多动脑少说多做厚积薄发-CSDN博客https://blog.csdn.net/qq_22182989/article/details/86726944

    官方文档

    对vuex不太熟悉的小伙伴。可以先去看看vuex官方的文档:

    提示

    这是与 Vue 3 匹配的 Vuex 4 的文档。

    Vuex 是什么? | Vuexhttps://vuex.vuejs.org/zh/

     如果您在找与 Vue 2 匹配的 Vuex 3 的文档,请在这里查看

    Vuex 是什么? | Vuexhttps://v3.vuex.vuejs.org/zh/

    下面是常见面试题:


     

    1.vuex是什么?怎么使用?哪种功能场景使用它?

    Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。简单来说就是:应用遇到多个组件共享状态时,使用vuex。

    场景:多个组件共享数据或者是跨组件传递数据时,

    比如:单页应用中,组件之间的状态。音乐播放、登录状态、加入购物车

    怎么使用?

    vue框架中状态管理。在main.js引入store,注入。
    新建了一个目录store.js,…… export 。

    vuex的流程

    页面通过mapAction异步提交事件到action。action通过commit把对应参数同步提交到mutation,mutation会修改state中对应的值。最后通过getter把对应值跑出去,在页面的计算属性中,通过,mapGetter来动态获取state中的值

    2.vuex有哪几种属性?vuex的store有几个属性值?分别讲讲它们的作用是什么?

    有五种,分别是State , Getter , Mutation , Action , Module (就是mapAction)


    state => 基本数据(数据源存放地)
    getters => 从基本数据派生出来的数据
    mutations => 提交更改数据的方法,同步!
    actions => 像一个装饰器,包裹mutations,使之可以异步。
    modules => 模块化Vuex

    1. state:vuex的基本数据,用来存储变量

    2. geeter:从基本数据(state)派生的数据,相当于state的计算属性

    3. mutation:提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数,提交载荷作为第二个参数。

    4. action:和mutation的功能大致相同,不同之处在于 ==》1. Action 提交的是 mutation,而不是直接变更状态。 2. Action 可以包含任意异步操作。

    5. modules:模块化vuex,可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰,方便管理。

    vuex的state、getter、mutation、action、module特性分别是什么?

    答:state:存放公共数据的地方
      getter:获取根据业务场景处理返回的数据
      mutations:唯一修改state的方法,修改过程是同步的
      action:异步处理,通过分发操作触发mutation
      module:将store模块分割,减少代码臃肿

    页面刷新后vuex的state数据丢失怎么解决?


    就是放在localStorage 或者就是sessionStorage ,或者借用辅助插vuex-persistedstate。

    vuex-persistedstate的createPersistedState()方法,谁用谁知道

    使用vuex的优势是什么?


    答:作为全局变量来用;vue是单向数据流,有一个vuex来建一个”全局仓库“,可以减少很多开发时候的”传参地狱“。其实vuex中的所有功能都能够通过其他的方式进行实现,只不过vuex对这些方法进行了整合处理,使用起来更加便捷,同时也便于维护。

    你理解的vuex是什么呢?哪些场景会用到?不用会有问题吗?有哪些特性?

    Vuex解决了什么问题?

    答:多个组件依赖于同一状态时,来自不同组件的行为需要变更同一状态。

    vuex 的 store 特性是什么

    • vuex 就是一个仓库,仓库里放了很多对象。其中 state 就是数据源存放地,对应于一般 vue 对象里面的 data
    • state 里面存放的数据是响应式的,vue 组件从 store 读取数据,若是 store 中的数据发生改变,依赖这相数据的组件也会发生更新
    • 它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性

    vuex 的 getter 特性是什么

    • getter 可以对 state 进行计算操作,它就是 store 的计算属性
    • 虽然在组件内也可以做计算属性,但是 getters 可以在多给件之间复用
    • 如果一个状态只在一个组件内使用,是可以不用 getters

    vuex 的 mutation 特性是什么

    • action 类似于 muation, 不同在于:action 提交的是 mutation,而不是直接变更状态
    • action 可以包含任意异步操作

    vue 中 ajax 请求代码应该写在组件的 methods 中还是 vuex 的 action 中?请求数据是写在组件的methods中还是在vuex的action中?

    答:如果请求的数据是多个组件共享的,为了方便只写一份,就写vuex里面,如果是组件独用的就写在当前组件里面。

    如果请求来的数据不是要被其他组件公用,仅仅在请求的组件内使用,就不需要放入 vuex 的 state 里

    如果被其他地方复用,请将请求放入 action 里,方便复用,并包装成 promise 返回

    怎么监听vuex数据的变化?

    答:先用计算属性、然后再监听

    vuex使用actions时不支持多参数传递怎么办?

    答:放在对象里面

    5、你觉得vuex有什么缺点?

    答:页面刷新时会使state的数据初始化

    6、你觉得要是不用vuex的话会带来哪些问题?

    答:组件之间传值麻烦复杂

    • 可维护性会下降,你要修改数据,你得维护 3 个地方
    • 可读性下降,因为一个组件里的数据,你根本就看不出来是从哪里来的
    • 增加耦合,大量的上传派发,会让耦合性大大的增加,本来 Vue 用 Component 就是为了减少耦合,现在这么用,和组件化的初衷相背

    vuex 原理

    vuex 仅仅是作为 vue 的一个插件而存在,不像 Redux,MobX 等库可以应用于所有框架,vuex 只能使用在 vue 上,很大的程度是因为其高度依赖于 vue 的 computed 依赖检测系统以及其插件系统,

    vuex 整体思想诞生于 flux,可其的实现方式完完全全的使用了 vue 自身的响应式设计,依赖监听、依赖收集都属于 vue 对对象 Property set get 方法的代理劫持。最后一句话结束 vuex 工作原理,vuex 中的 store 本质就是没有 template 的隐藏着的 vue 组件;

    使用 Vuex 只需执行 Vue.use(Vuex),并在 Vue 的配置中传入一个 store 对象的示例,store 是如何实现注入的?美团

    Vue.use(Vuex) 方法执行的是 install 方法,它实现了 Vue 实例对象的 init 方法封装和注入,使传入的 store 对象被设置到 Vue 上下文环境的store中。因此在VueComponent任意地方都能够通过this.store 访问到该 store。

    state 内部支持模块配置和模块嵌套,如何实现的?美团

    在 store 构造方法中有 makeLocalContext 方法,所有 module 都会有一个 local context,根据配置时的 path 进行匹配。所以执行如 dispatch('submitOrder', payload)这类 action 时,默认的拿到都是 module 的 local state,如果要访问最外层或者是其他 module 的 state,只能从 rootState 按照 path 路径逐步进行访问。

    在执行 dispatch 触发 action(commit 同理)的时候,只需传入(type, payload),action 执行函数中第一个参数 store 从哪里获取的?美团

    store 初始化时,所有配置的 action 和 mutation 以及 getters 均被封装过。在执行如 dispatch('submitOrder', payload)的时候,actions 中 type 为 submitOrder 的所有处理方法都是被封装后的,其第一个参数为当前的 store 对象,所以能够获取到 { dispatch, commit, state, rootState } 等数据。

    Vuex 如何区分 state 是外部直接修改,还是通过 mutation 方法修改的?vuex怎么知道state是通过mutation修改还是外部直接修改的?美团

    通过$watch监听mutation的commit函数中_committing是否为true;严格模式下不允许直接修改。

    Vuex 中修改 state 的唯一渠道就是执行 commit('xx', payload) 方法,其底层通过执行 this._withCommit(fn) 设置_committing 标志变量为 true,然后才能修改 state,修改完毕还需要还原_committing 变量。外部修改虽然能够直接修改 state,但是并没有修改_committing 标志位,所以只要 watch 一下 state,state change 时判断是否_committing 值为 true,即可判断修改的合法性。

    调试时的"时空穿梭"功能是如何实现的?美团

    devtoolPlugin 中提供了此功能。因为 dev 模式下所有的 state change 都会被记录下来,'时空穿梭' 功能其实就是将当前的 state 替换为记录中某个时刻的 state 状态,利用 store.replaceState(targetState) 方法将执行 this._vm.state = state 实现。

    4.Vue.js中ajax请求代码应该写在组件的methods中还是vuex的actions中?

    一、如果请求来的数据是不是要被其他组件公用,仅仅在请求的组件内使用,就不需要放入vuex 的state里。

    二、如果被其他地方复用,这个很大几率上是需要的,如果需要,请将请求放入action里,方便复用,并包装成promise返回,在调用处用async await处理返回的数据。如果不要复用这个请求,那么直接写在vue文件里很方便

    vuex怎样赋值?vuex存储数据的方法有哪些?

    使用下面这两种方法存储数据:

      dispatch:异步操作,写法: this.$store.dispatch('actions方法名',值)

      commit:同步操作,写法:this.$store.commit('mutations方法名',值)

    6.Vuex中如何异步修改状态

    actions与mutations作用类似,都是可以对状态进行修改。不同的是actions是异步操作的。

    actions是可以调用Mutations里的方法的。

    const actions={
    	addActions(context){
    		context.commit('add',10);//调用mutations中的方法
    		setTimeout(()=>{context.commit('reduce')},5000)
    	//	setTimeOut(()=>{context.commit('reduce')},3000);
    		console.log('我比reduce提前执行');
    	},
    	
    	reduceActions({commit}){
    		commit('reduce');
    	}
    }

    7.vuex的action和mutation的特性是什么?Vuex中actions和mutations的区别?

    答:Action

    • 一些对 State 的异步操作可放在 Action 中,并通过在 Action 中 commit Mutation 变更状态
    • Action 可通过 store.dispatch() 方法触发,或者通过 mapActions 辅助函数将 vue 组件的 methods 映射成 store.dispatch() 调用

       Mutation

    • 在 vuex 的严格模式下,Mutaion 是 vuex 中改变 State 的唯一途径
    • Mutation 中只能是同步操作
    • 通过 store.commit() 调用 Mutation

    mutations可以直接修改state,但只能包含同步操作,同时,只能通过提交commit调用(尽量通过Action或mapMutation调用而非直接在组件中通过this.$store.commit()提交)
    actions是用来触发mutations的,它无法直接改变state,它可以包含异步操作,它只能通过store.dispatch触发

    Mutation 更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件:每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数

    const store = new Vuex.Store({
      state: {
        count: 1
      },
      mutations: {
        increment (state) {
          // 变更状态
          state.count++
        }
      }
    })

    Action Action 类似于 mutation,不同在于:

    • Action 提交的是 mutation,而不是直接变更状态。
    • Action 可以包含任意异步操作。 .
    const store = new Vuex.Store({
      state: {
        count: 0
      },
      mutations: {
        increment (state) {
          state.count++
        }
      },
      actions: {
        increment (context) {
          context.commit('increment')
        }
      }
    })

    Vuex中状态储存在哪里,怎么改变它?

    答:存储在state中,改变Vuex中的状态的唯一途径就是显式地提交 (commit) mutation。

    Vuex中状态是对象时,使用时要注意什么?

    答:对象是引用类型,复制后改变属性还是会影响原始数据,这样会改变state里面的状态,是不允许,所以先用深度克隆复制对象,再修改。

    怎么在组件中批量使用Vuex的state状态?

    答:使用mapState辅助函数, 利用对象展开运算符将state混入computed对象中

    import {mapState} from 'vuex' export default{ computed:{ ...mapState(['price','number']) } }

    你有使用过vuex的module吗?主要是在什么场景下使用?

    答:把状态全部集中在状态树上,非常难以维护。按模块分成多个module,状态树延伸多个分支,模块的状态内聚,主枝干放全局共享状态

     vuex一个例子方法

    在testApp中建store文件 ==》 store文件下又有modules文件夹和getter.js 和 index.js ==》 store文件下建user.js

    在store文件下的index.js中引入

    import Vue from 'vue'
    import Vuex from 'vuex'
    import user from './modules/user'
    import global from './modules/global'
    import getters from './getters'
    
    Vue.use(Vuex)
    
    const store = new Vuex.Store({
      modules: {
        user
      },
      getters
    })
    
    export default store

      在store文件下的getters.js中引入

    const getters = {
      self: state => state.user.self,
      token: state => state.user.token,
      currentCommunity: (state, getters) => {
        let cid = getters.currentCommunityId
        return getters.communities.filter(item => {
          return item.communityId === cid
        })
      }
    }
    
    export default getters

    在modules文件下的user.js写代码

    const user = {
      state:{
          self: null,
          token: '',
      },
      mutations:{
          SET_SELF: (state, self) => {
               state.self = self
           },
           SET_TOKEN: (state, token) => {
               state.token = token
           }
      },
      actions:{
           login ({ commit }, res) {
                commit('SET_SELF', res.self)
                commit('SET_TOKEN', res.token)
          }
       }
    }
    export default user   

    参考资料:

    vuex常见面试题_Yriaf@2022的博客-CSDN博客1.vuex是什么?怎么使用?哪种功能场景使用它?答:vue框架中状态管理。在main.js引入store,注入。新建了一个目录store.js,…… export 。场景有:单页应用中,组件之间的状态。音乐播放、登录状态、加入购物车2.vuex有哪几种属性?答:有五种,分别是 State、 Getter、Mutation 、Action、 Modulestate => 基本数据(数据源存放地)getters => 从基本数据派生出来的数据mutations => 提交更改https://blog.csdn.net/weixin_45644355/article/details/107556353vuex常见面试题 - 知乎(答案已更新...)1.vuex是什么?怎么使用?哪种功能场景使用它?Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生…https://zhuanlan.zhihu.com/p/163283018

    vuex常见面试题 - two-fish - 博客园1.什么是Vuex? 答:Vuex 是一个专为 Vue.js 应用程序开发的状态管理插件 2.Vuex解决了什么问题? 答:多个组件依赖于同一状态时 来自不同组件的行为需要变更同一状态。 3.vuexhttps://www.cnblogs.com/smokefish/p/14671180.htmlVUE之VUEX常见面试题_从0到1的成长的博客-CSDN博客_vuex面试题1.vuex是什么?怎么使用?哪种功能场景使用它?答:vue框架中状态管理。在main.js引入store,注入。新建了一个目录store.js,….. export 。解决的问题:多个视图依赖同一个状态来自不同视图的行为需要变更同一状态适用于中大型的单页面应用2.vuex有哪几种属性?答:有五种,分别是 State、 Getter、Mutation 、Action、 Modulestate:存放公共数据的地方;getter:获取根据业务场景处理返回的数据;mutationshttps://blog.csdn.net/qq_41161982/article/details/112648598

    Vue问得最多的面试题 - 知乎什么是 mvvm?MVVM 是 Model-View-ViewModel 的缩写。mvvm 是一种设计思想。Model 层代表数据模型,也可以在 Model 中定义数据修改和操作的业务逻辑;View 代表 UI 组件,它负责将数据模型转化成 UI 展现出来,Vie…https://zhuanlan.zhihu.com/p/53703176

    VUEX面试题 - 菜鸟小何 - 博客园1、你有写过vuex中store的插件吗? 答:没有 2、你有使用过vuex的module吗?主要是在什么场景下使用? 答:把状态全部集中在状态树上,非常难以维护。按模块分成多个module,状态树延https://www.cnblogs.com/qwer123dsada/p/14803352.html

    展开全文
  • Vuex面试题

    2022-05-01 14:56:35
    Vuex是什么? Vuex是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 什么是状态管理模式? 让我们从一个简单的Vue...

    Vuex是什么?

    Vuex是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。

    什么是状态管理模式

    让我们从一个简单的Vue计数器应用开始:

    new Vue({
    	//state
    	data(){
    		return{
    			count:0,
    		}
    	},
    	//view
    	template:`
    		<div>{{count}}</div>
    	`,
    	//actions
    	methods:{
    		increment(){
    			this.count++
    		},
    	},
    })
    

    这个状态自管理应用包含以下几个部分:

    • state,驱动应用的数据源
    • view,以声明方式将state映射到视图
    • actions,相应在view上的用户输入导致的状态变化
      以下是一个表示单向数据流理念的简单示意:
      在这里插入图片描述
      但是,当我们的应用遇到多个组件共享状态时,单向数据流的简洁性很容易被破坏:
    • 多个视图依赖同一状态
    • 来自不同视图的行为需要变更同一状态

    对于问题1,传参的方法对于多层嵌套的组件将会非常繁琐,并且对于兄弟组件间的状态传递无能为力。
    对于问题2,我们经常会采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。
    以上的这些模式非常脆弱,通常会导致无法维护的代码。

    我们可以把组件的共享状态抽离出来,以一个全局单例模式管理,通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性,我们的代码将会变得更结构化且容易维护。
    在这里插入图片描述

    vuex的store插件是什么?

    Vuex的store接受plugins选项,这个选项暴露出每次mutation的钩子。Vuex插件就是一个函数,它接收store作为唯一参数:

    const myPlugin = store => {
    	//当store初始化后调用
    	store.subscribe((mutation,state) = {
    		//每次mutation之后调用
    		//mutation的格式为{type,payload}
    	}) 
    }
    
    const store = new Vuex.Store({
    	state:{},
    	getters:{},
    	mutations:{},
    	actions:{},
    	modules:{},
    	plugins:[myPlugin],
    })
    

    Vuex怎么监听组件中提交mutation和action?

    1. 用Vuex.Store的实例方法subscribe监听组件中提交mutation
    2. 用Vuex.Store的实例方法subscribeAction监听组件中提交action
    function createPlugin(param){
    	//???为什么这样写啊,直接执行不好吗?
    	return store => {
    		store.subscribe((mutation,state) => {
    			console.log(mutation.type)//是哪个mutation
    			console.log(mutation.payload)
    			console.log(state)
    		})
    		store.subscribeAction({
    			//提交action之前
    			before:(action,state) => {
    				console.log(`before action ${action.type}`)
    			},
    			//提交action之后
    			after:(action,state){
    				console.log(`after action ${action.type}`)
    			}
    		})
    		
    	}
    }
    

    在插件内提交Mutation

    在插件中不允许直接修改状态,类似于组件,只能通过提交mutation来触发变化。
    通过提交mutation,插件可以用来同步数据源到store。

    生成State快照

    有时候插件需要获得状态的快照,比如改变的前后状态。想要实现这项功能,你需要对状态对象进行深拷贝。

    内置Logger插件

    Vuex自带一个日志插件用于一般的调试

    import createLogger from 'vuex/dist/logger'
    
    const store = new Vuex.Store({
    	plugins:[createLogger()],
    })
    

    vuex的module是什么?主要使用场景?

    由于使用单一状态树,应用的所有状态会集中到一个比较大的状态。当应用变得非常复杂时,store对象有可能变得相当臃肿。

    为了解决这个问题,Vuex允许我们将store分割成模块(module),每个模块拥有自己的state,mutation,action,getter,甚至是嵌套子模块

    在模块中,getter和mutation和action中怎么访问全局的state和getter?

    • 在getter中,可以通过第3个参数rootState和第4个参数rootGetters
    • 在mutation中,不可以访问全局的state和getter
    • 在action中,第一个参数context中的context.rootState访问到全局的state,context.rootGetters访问到全局的getter

    Vuex的命名空间是什么?

    默认情况下,模块内部的action,mutation和getter是注册在全局命名空间的,这样使得多个模块能够对同一mutation或action作出相应。

    如果希望你的模块具有更高的封装度和复用性,你可以添加namespace:true的方式使其成为带命名空间的模块。当模块被注册后,它的所有getter,action及mutation都会自动根据模块注册的路径调整命名。

    const store = new Vuex.Store({
    	modules:{
    		account:{
    			namespace:true,
    			state:() => ({...})//模块内的状态已经是嵌套的了,使用namespace属性不会对其产生影响
    			getters:{
    				isAdmin(){...}// -> getters['account/isAdmin']
    			},
    			actions:{
    				login(){},//->dispatch('account/login')
    			},
    			mutations:{
    				login(){},// -> commit('account/login')
    			},
    			modules:{
    				//继承父模块的命名空间
    				myPage:{
    					state:()=>({}),
    					getters:{
    						profile(){}//->getters['account/profile']
    					},
    				},
    				
    				//进一步嵌套命名空间
    				posts:{
    					namespace:true,
    					state:() => ({}),
    					getters:{
    						popular(){}//->getters['account/posts/popular']
    					},
    				},
    			},
    		},
    	},
    })
    

    启用了命名空间的getter和action会收到局部化的getter,dispatch和commit。换言之,你在使用模块内容(module assets)时不需要在同一模块内额外添加控件名前缀。更改namespace属性后不需要修改模块内的代码。

    在带命名空间的模块内访问全局内容(Global Assets)

    如果你希望使用全局state和getter,rootState和rootGetters会作为第3和第4参数传入getter,也会通过context对象的属性传入action

    若需要在全局命名空间内分发action或提交mutation,将{root:true}作为第三参数传给dispatch或commit即可。

    modules:{
    	foo:{
    		namespace:true,
    		getters:{
    			//在这个模块的getter中,getters被局部化了
    			//你可以使用getter的第四个参数来调用rootGetters
    			someGetter(state,getters,rootState,rootGetters){
    				getters.someOtherGetter //-> 'foo/someOtherGetter'
    				rootGetters.someOtherGetter // -> 'someOtherGetter'
    			},
    			someOtherGetter:state => {},
    		},
    
    		actions:{
    			//在这个模块中,dispatch和commit也被局部化了
    			//他们可以接受'root'属性以访问根dispatch或commit
    			someAction({dispatch,commit,getters,rootGetters}){
    				getters.someGetter // -> 'foo/someGetter'
    				rootGetters.someGetter // -> 'someGetter'
    				dispatch('someOtherAction')//->'foo/someOtherAction'
    				dispatch('someOtherAction',null,{root:true})//-> 'someOtherAction'
    				commit('someMutation')//->'foo/someMutation'
    				commit('someMutation',null,{root,true})//->'someMutation'
    			},
    			someOtherAction(context,payload){},
    		},
    	},
    },
    

    在带命名空间的模块注册全局action

    若需要在带命名空间的模块注册全局action,你可添加root:true,并将这个action的定义放在函数handler中

    {
    	actions:{
    		someOtherAction({dispatch}){
    			dispatch('someAction')
    		},
    	},
    	modules:{
    		foo:{
    			namespace:true,
    			actions:{
    				someAction:{
    					root:true,
    					handler(namespacedContext,payload){}//->'someAction'
    				},
    			},
    		},
    	},
    }
    

    Vuex中actions和mutations有什么区别?

    mutation:可以直接修改state中的状态,只能包含同步操作,通过提交commit调用,(尽量通过action或mapMutation调用而非直接在组件中通过this.$store.commit()提交)
    actions: 可以包含异步操作,通过store.dispatch()触发

    Vuex使用actions时,如何传递参数?

    1. this.$store.dispatch(‘xxx’,{name:xxx})
    2. this.$store.dispatch({type:xxx,name:xxx})

    Vuex的缺点

    由于Vuex中的数据存放在内存中,因此刷新页面时,数据会丢失

    不用Vuex的话带来哪些问题?

    组件之间传值不方便

    Vuex怎么知道state是通过mutation修改还是外部直接修改的?

    1. Vuex可以设置严格模式,严格模式下,直接修改会报错
    2. ???通过$watch监听mutation的commit函数中_committing是否为true

    请求数据是写在组件的methods中还是写在Vuex的actions中?

    如果请求的数据是多个组件共享的,为了方便只写一份,就写在vuex里面。如果是组件独用的,就写在组件里面

    怎么监听vuex数据的变化

    先用计算属性,然后再监听

    页面刷新后vuex的state数据丢失怎么解决?

    vuex-presistedstate的createPersistedState()方法

    Vuex的优势?

    vue是单向数据流,有一个vuex来建一个全局仓库,可以减少很多时候的传参地狱。

    Vuex中action通常是异步的,那么如何知道action什么时候结束呢?

    在action函数中返回Promise,然后再提交时用then处理

    Vuex中有2个action,分别是actionA和actionB,其内都是异步操作,在actionB要提交actionA,需在actionA处理结束再处理其它操作,怎么实现?

    利用ES6的async和await来实现

    actions:{
    	async actionA({commit}){
    		//...
    	},
    	async actionB({dispatch}){
    		await dispatch('actionA')//等待actionA完成
    	},
    }
    

    在v-model上怎么用Vuex中state的值?

    <input v-model='message'>
    
    computed:{
    	message:{
    		get(){
    			return this.$store.state.message
    		},
    		set(value){
    			this.$store.commit('updateMessage',value)
    		},
    	}
    }
    

    在执行dispatch触发action(commit同理)的时候,只需要传入(type,payload),action执行函数中第一个参数store从哪里获取的?

    store初始化时,所有配置的action和mutation,getters均被封装过。在执行如dispatch(‘submitOrder’,payload)的时候,action中type为submitOrder的所有处理办法都是被封装后的,其第一个参数为当前的store对象

    展开全文
  • vuex面试题总结

    千次阅读 2022-02-07 18:47:39
    1.什么是vuex Vuex是一个专为 Vue.js 应用程序开发的状态管理模式,它由五部分组成: 分别是:state,actions,mutations,getters,modules 2.vuex由五部分组成 state: 数据 actions:可以包含异步操作 mutations: 唯一...

    1.什么是vuex

    Vuex是一个专为 Vue.js 应用程序开发的状态管理模式,它由五部分组成:
    分别是:state,actions,mutations,getters,modules
    

    2.vuex由五部分组成

    • state: 数据
    • actions:可以包含异步操作
    • mutations: 唯一可以修改state数据的场所
    • getters: 类似于vue组件中的计算属性,对state数据进行计算(会被缓存)
    • modules:模块化管理store(仓库),每个模块拥有自己的 state、mutation、action、getter

    3.如何使用

    store—>index.js

    import vue from 'vue'
    import Vuex from 'vuex'
    Vue.use(vuex);
    
    const state= ()=>{ token:''}
    
    const actions = {
      set_token({commit},val){
        commit("to_token",val)
     }
    }
    const mutations = {
      to_token(state,val){
       state.token=val;
     }
    }
    const getters = {}
    let store = new Vuex.store({
     state,
     actions,
     mutations,
     getters
    })
    
    module.export=store;
    

    home.vue

    <template>
      <div>
        {{$store.state.token}}
      </div>
    </template>
    <script>
    
    export default={
     name: 'Home',
      data() {
        return {
          tel: '',
              }
      },
      created(){
        //调用acionts中的方法
        this.$store.dispatch('set_token',12345);
        //调用mutations中的方法
        this.$store.commit('to_token',123456)
      }
    }
    <script>
    

    4.高级用法 ----- 数据持久化

    问题:存储在vuex中的状态,刷新页面,会丢失。
    最简单的做法就是利用插件 vuex-persistedState。
    为了解决刷新页面数据丢失,才有了数据持久化。
    

    (1)、安装
    cnpm install vuex-persistedState -S
    备注:

    -S 是--save的简写,意为:把插件安装到dependencies(生产环境依赖)中
    -D是--save-dev的简写,意为:把插件安装到devDependencies(开发环境依赖)中
    

    (2)、使用

    import createPersistedState from 'vuex-persistedstate'
    const store = new Vuex.Store({
      state,
      mutations,
      actions,
      getters,
      plugins: [createPersistedState({
        storage: sessionStorage,
        key: "token"
      })]//会自动保存创建的状态。刷新还在
    })
    

    参数:

    storage:存储方式。(sessionStorage,localStarage) key:定义本地存储中的key
    

    5.高级语法---- 模块化管理数据 (modules)

    (1)、什么时候需要用到模块管理vuex数据。

    项目庞大,数据信息量特别大的时候,我们可以考虑分模块形式管理数据,比如user模块管理用
    户信息数据,cart模块管理购物车数据,shop模块管理商品信息数据。
    
    import vue from 'vue'
    import Vuex from 'vuex'
    Vue.use(vuex);
    
    const state= ()=>{ token:''}
    const actions = {
       set_token({commit},val){
         commit("to_token",val)
      }
    }
    const mutations = {
       to_token(state,val){
        state.token=val;
      }
    }
    const getters = {}
    
    
    //user模块
    let user = {
      namespaced: true, //一定要开始命名空间。
      state: { userid: 1234 },
      actions: {
      },
      mutations: {
        SET_USERID(state, val) {
          state.userid = val;
        }
      },
      getters: {
    
      }
    }
    
    //购物车数据的模块
    let cart = {
      namespaced: true,
      state: { userid: 567 },
      actions: {
    
      },
      mutations: {
      },
      getters: {
    
      }
    }
    
    
    const store = new Vuex.Store({
      state,
      mutations,
      actions,
      getters,
      modules: {
        user,
        cart
      },
      plugins: [createPersistedState({
        storage: sessionStorage,
        key: "token"
      })]//会自动保存创建的状态。刷新还在
    })
    
    export default store
    

    home.vue如何使用

    获取user模块的`userid`
    this.$store.state.user.userid
    this.$store.commit("user/SET_USERID",12345)// 前面是指定模块user 中的SET_USERID 方法,
    后面是传参 可以是对象、数组、字符串等
    

    6.高级用法----- 辅助函数(语法糖)

    1. 有那几个辅助函数(4大金刚)
      mapState,mapActions,mapMutations,mapGetters
    2. 辅助函数可以把vuex中的数据和方法映射到vue组件中。达到简化操作的目的
    3. 如何使用
      home.vue
    <template>
     <div id="">
       {{ token }}
       {{ token - x }}
     </div>
    </template>
    
    <script>
    import { mapActions, mapGetters, mapMutations, mapState } from 'vuex'
    
    import {createNamespacedHelpers} from 'vuex'
    
    const {mapState:mapStateUser,mapActions:mapActionUser,mapMutations:mapMutaionuser} = createNamespacedHelpers('user')
    
    const {mapState:mapStateCart,mapActions:mapActionCart,mapMutations:mapMutaionCart} = createNamespacedHelpers('cart')
    
    
    
    export default {
     name: '',
     data() {
       return {}
     },
     computed: {
       ...mapState({
         token: 'token'
       }),
       ...mapGetters(['token-x']),
       ...mapSateUser(['userid']),
       ...mapStateCart({cartid:'userid'})
     },
     //生命周期 - 创建完成(访问当前this实例)
     created() {
       this.setToken('123456')
     },
     //生命周期 - 挂载完成(访问DOM元素)
     mounted() {},
     methods: {
       ...mapActions({
         setToken: 'setToken'
       }),
       ...mapMutations(['SET_TOKEN']),
       ...mapMutaionUser({
       setId:"setToken"
      })
     }
    }
    </script>
    
    展开全文
  • 前端Vuex面试题

    千次阅读 2020-09-03 21:59:51
    什么是VuexVuex 是一个专为 Vue.js 应用程序开发的状态管理插件。它采用集中式存储管理应用的所有组件的状态,而更改状态的唯一方法就是在mutaions里修改state,actions不能直接修改state vuex的组成结构示意图: ...
  • vuex面试题

    2021-10-27 01:31:06
    什么是Vuex?】 Vuex 是一个专为 Vue.js 应用程序开发的状态管理插件。它采用集中式存储管理应用的所有组件的状态 【2.Vuex解决了什么问题?】 多个组件依赖于同一状态时,来自不同组件的行为需要变更同一状态。 ...
  • vuex 面试题

    2021-01-03 16:08:02
    什么是vuex vuex:是一个转为vuex.js开发的状态状态管理器,采用集中式储存的所有组件状态。 五个属性:state、getters、mutations、actions、module 基本使用:新建store.js文件,最后main.js中引入,并挂在实例上...
  • Vuex面试题总结必看!

    2021-09-25 19:06:05
    1.什么是VuexVuex 是一个专为 Vue.js 应用程序开发的状态管理插件。它采用集中式存储管理应用的所有组件的状态,而更改状态的唯一方法是提交mutation。 2.什么时候用Vue? 多个组件依赖于同一状态时。 ...
  • 【vue】vuex常见面试题

    2022-05-01 08:22:29
    文章目录【vue】vuex常见面试题一、vuex简介对vuex的理解各模块在流程中的功能:Vuex实例应用二、常见面试题1.Vuex 为什么要分模块并且加命名空间2.Vuex和单纯的全局对象有什么区别?3.为什么 Vuex 的 mutation 中不...
  • Vuex面试题汇总

    万次阅读 2020-01-12 15:46:21
    vuex面试题汇总
  • VUE之VUEX常见面试题

    千次阅读 多人点赞 2021-01-15 10:18:42
    1.vuex是什么?怎么使用?哪种功能场景使用它? 答:vue框架中状态管理。在main.js引入store,注入。 新建了一个目录store.js,….. export 。 解决的问题:多个视图依赖同一个状态来自不同视图的行为需要变更...
  • Vuex常见面试题

    千次阅读 2022-05-16 20:25:41
    1.vuex是什么?怎么使用?哪种功能场景使用它? Vuex 是一个专为 Vue.js 应用程序开发的状态管理插件。(公共数据库) 当项目遇到以下两种场景时 1. 多个组件依赖于同一状态时。 2. 来自不同组件的行为需要变更...
  • 呕心沥血60道Vue、Vue-Router、Vuex面试题及详解!

    万次阅读 多人点赞 2020-10-17 20:45:23
    VUE60道面试题总结 生命周期函数 1.什么是 vue 生命周期 我们知道 vue 是通过构建数据驱动的web界面的渐进式框架 所谓周期就是指从一个起点到一个终点的过程,那么生命周期就是指从生命开始到生命结束的过程 vue每...
  • vuex的常见面试题

    千次阅读 多人点赞 2021-09-29 14:17:17
    1.vuex是什么?怎么使用?哪种功能场景使用它? 答:Vuex 是一个专为 Vue.js 应用程序开发的状态管理插件。(公共数据库) 当项目遇到以下两种场景时 1. 多个组件依赖于同一状态时。 2. 来自不同组件的行为...
  • VUE60道面试题总结 生命周期函数 1.什么是 vue 生命周期 我们知道 vue 是通过构建数据驱动的web界面的渐进式框架所谓周期就是指从一个起点到一个终点的过程,那么生命周期就是指从生命开始到生命结束的过程vue每...
  • vue常见面试题 1.vue优点? 2.vue父组件向子组件传递数据? 3.子组件像父组件传递事件? 4.v-show和v-if指令的共同点和不同点? 6.的作用是什么? 7.如何获取dom? 8.说出几种vue当中的指令和它的用法? 9. ...
  • 关于Vue的各类面试题 下面列举一些题目 什么是MVVM? mvvm 和mvc区别?它和其它框架(jquery)的区别是什么?哪些场景适合? vue的优点是什么? 组件之间的传值? vue.cli中怎样使用自定义的组件?有遇到过哪些问题...
  • 关于Vuex面试题

    2022-05-02 21:12:02
    大佬提问:“说说你知道的vuex” 我的回答:" vuex是一个vue的状态管理工具。 vuex有五大核心属性:state、getter、mutation、action、module。 首先state,是一个全局的状态存储,是唯一的数据载体,对应vue...
  • Vuex 是什么? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。每一个 Vuex 应用的核心就是 store(仓库)。“store” 基本上就是一个容器,它包含着你的应用中大部分的状态(state) Vuex 的状态存储是响应式的...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 7,173
精华内容 2,869
关键字:

vuex面试题

友情链接: kmeans_segment.rar