• vuex的用法和一些容易被忽略的地方


    因为一般都会通过vue-cli 脚手架去初始化一个vue项目模板.

    个人习惯在 src 中新建一个store.js【向外export一个vuex 的 Store实例】 用于当做 vuex核心文件,

    然后建立 state.js/mutations.js/actions.js/getters.js【分别向外导出state,getters,mutaions,actions对象】 等四个vuex对象文件。

    之后store.js中引入四个对象文件,并讲四个对象挂载到 vuex的 Store实例上:

    import Vue from 'vue'
    import Vuex from 'vuex'
    Vue.use(Vuex)
    
    import state from './state'
    import actions from './actions'
    import mutations from './mutations'
    import getters from './getters'
    
    export default new Vuex.Store({
      state,
      actions,
      mutations,
      getters
    })

    之后讲vuex实例挂载到vue实例中!!!

    1-Actions 和 2- mutations 区别:

    1 用于异步更新state  | |  2 一般是同步更新 state

    1 其实也是通过调用 2-mutaions 中的一个mutation 实现state数据的更新,只不过1中可能会发异步请求,讲结果更新为 state新数据

    mapState/mapActions 去调用获取state中的数据 /  映射Actions 中的异步方法,映射成功的方法可以被直接调用!!

    语法:

    ...mapActions(['trigger_getPosition']) 【methods 属性中的使用 mapActions】
    这里映射 actions 中的 trigger_getPosition 方法,之后 可以在 mounted()等 钩子函数中 使用 this.tirgger_getPositon()直接调用 trigger_getPosition() 方法

    mapState用法一样。!!
  • 相关阅读:
    君の名は~ 观后感
    dp1,明天补题解
    【bzoj1222】[HNOI2001]产品加工
    Daily~Miracles
    luogu 1273有线电视网
    luogu 1373
    codeforces 721C
    codeforces 706E
    The~Best~Chanteur~宇多田ヒカル
    codeforces706D
  • 原文地址:https://www.cnblogs.com/Hijacku/p/14814640.html
Copyright © 2020-2023  润新知