什么是 vuex-helpers
vuex-helpers 是一个用于辅助 vuex 开发的 npm 包。它提供了一些常用的 helper 函数，可以让你更加方便地访问和操作 vuex 中的 state, getters, mutations, actions 等。它是一个轻量级的库，但是提供的 helper 函数非常实用，大大简化了 vuex 开发的代码量。
如何安装和使用 vuex-helpers
安装
要使用 vuex-helpers，你需要先安装它：
--- ------- ------------ ------
使用
使用 vuex-helpers 建议先了解 vuex 的基本概念和 API，这里不再赘述。在使用 vuex-helpers 前，你需要先实例化一个 VuexHelpers 对象，并把它传递给你的 vuex store：
------ - ----------- - ---- -------------- -- --- ----- ----------- - --- ------------------
然后你就可以通过这个 vuexHelpers 对象来访问和操作 vuex 中的 state, getters, mutations, actions 等：
-- -- ----- ------ ----- -------- - -------------------------------------- -- -- ----- ------ ----------------------------------------- --------- -- ---- -------- --------------------------------------------- -------- -- ---- ------ --------------------------------------------- --------
以上仅仅是一些最基本的用法，下面将介绍更多实用的 helper 函数。
VuexHelpers 提供的 helper 函数
get
用于获取 state 中的某个属性。它接收一个字符串类型的参数，格式为 "module/path/to/prop"，其中 "module" 为模块名，"path/to/prop" 为属性的路径。例如：
----- ------------- - --------------------------------------
update
用于更新 state 中的某个属性。它接收一个字符串类型的参数，格式同 get，以及一个新的值，例如：
-- ------ ----------------------------------------- --------- -- ------------ ----------------------------------------- --- -- - ------ -------------------- --
commit
用于触发一个 mutation。它接收一个字符串类型的参数，格式为 "module/path/to/mutation"，以及一个 payload，例如：
--------------------------------------------- --------
dispatch
用于触发一个 action。它接收一个字符串类型的参数，格式为 "module/path/to/action"，以及一个 payload，例如：
--------------------------------------------- --------
getters
一个对象，包含了所有的 getters。可以直接访问某个 getter，例如：
----- --------------- - ------------------------------
mutations
一个对象，包含了所有的 mutations。可以直接触发某个 mutation，例如：
-------------------------------------------
actions
一个对象，包含了所有的 actions。可以直接触发某个 action，例如：
---------------------------------------
getModule
用于获取一个模块，并返回一个新的 VuexHelpers 对象，例如：
----- ------------- - ----------------------------------- -- ----------- ----- ------------- - -----------------------------
mapGetters
用于批量获取 getters，并将它们映射到组件的 computed 属性中。它接收一个数组或者对象类型的参数，数组中的每个元素或者对象中的每个属性都是一个字符串类型的 getter，例如：
------ - ---------- - ---- --------------
-- ---
------ ------- -
--------- -
---------------
-------------
--------------
------------------
--
-
-mapMutations
用于批量触发 mutations，并将它们映射到组件的 methods 属性中。它接收一个数组或者对象类型的参数，数组中的每个元素或者对象中的每个属性都是一个字符串类型的 mutation，例如：
------ - ------------ - ---- --------------
-- ---
------ ------- -
-------- -
-----------------
---------------
----------------
--------------------
--
-
-mapActions
用于批量触发 actions，并将它们映射到组件的 methods 属性中。它接收一个数组或者对象类型的参数，数组中的每个元素或者对象中的每个属性都是一个字符串类型的 action，例如：
------ - ---------- - ---- --------------
-- ---
------ ------- -
-------- -
---------------
-------------
--------------
------------------
--
-
-总结
vuex-helpers 是一个非常实用的 npm 包，它可以让你更加方便地访问和操作 vuex，大大简化了 vuex 开发的代码量。它提供了多个实用的 helper 函数，可以让你轻松地完成一些常用的操作。同时，它还提供了一些便捷的映射函数，可以让你更加方便地在组件中使用 vuex。如果你是一个 vuex 开发者，那么不妨尝试一下使用 vuex-helpers，相信它会给你带来意想不到的便利。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60055c4681e8991b448d9dca