当前位置: 首页 > 网络应用技术

Vuex中使用Getters和4个地图方法

时间:2023-03-07 02:48:59 网络应用技术

  Geters是商店中的新配置项目,而不是必要的配置项目。

  Getters是商店的计算属性,在状态中处理数据。它等同于计算,该计算将根据其依赖性进行缓存,并且只有当依赖关系更改会重新计算时。

  如何使用:直接在商店配置文件index.js中添加getters对象。相关方法在对象中配置。该方法是返回值,与计算的使用相同。

  Getters对象中的方法的方法是状态,可以通过状态获得要处理的数据。通过返回值确定您的值。

  步骤:index.js-> moto使用($store.getters。getters。方法名称)中的配置和使用

  存储配置文件索引

  组件使用:

  在组件中阅读状态中的数据:

  可以通过观察发现$ store.state的重复率很高,但必须以这种方式进行。因此,Vuex具有一个MAPSTATE,可以将数据映射为状态中的数据作为计算属性。我们可以直接使用计算属性。

  状态配置文件索引:状态:

  步骤:导入MapState->配置MAPSTATE->在计算属性中直接使用计算属性值

  进口:

  在计算属性中配置MAPSTATE:

  这里有两种配置:

  1.在组件中,计算名称和状态使用对象写入中的相应变量名称。

  2.在组件中,当相应变量名称在状态中时,计算名称被用作数组编写。

  对象写作:

  数组写作:

  与MapState类似,也有两种方法:

  步骤:import mapgetters->配置Mapgetters->直接在计算属性中直接使用计算属性值

  存储配置文件索引.js getters:

  这里有两种配置:

  1.在组件中,当计算属性名称不同时,计算名称和计算属性名称是不同的。

  2.当组件中的计算名称使用数组编写时,当Geters中的计算属性名称相同时。

  对象写作:

  数组写作:

  用于帮助生成操作对话的方法,即包含$ store.dispatch()的函数。

  如果需要传递参数,则在模板中绑定事件时需要传递良好的参数,否则参数是事件对象。

  组件中的方法通过调度触发操作中的方法:

  可以发现重复了这一点。$ store.dispatch代码,因此有一个Mapactions映射。相应的方法是通过Mapactions生成的。该方法将被调用以接触操作。

  步骤:导入mapactions->在方法中配置mapactions

  存储配置文件索引。JS:操作:

  这里有两种配置:

  1.组件中的方法名称和操作中的相应方法名称使用对象写作。

  2.组件中的方法名称与操作中的相应方法名称相同。

  对象写作:

  数组写作:

  用于帮助生成与突变的对话的方法,即包含$ store.commit()的函数。

  如果需要传递参数,则在模板中绑定事件时需要传递良好的参数,否则参数是事件对象。

  组件中的方法通过提交触发突变中的方法:

  同样:地图与MAPACTIONS相似。

  通过MAPMUTATIONS生成相应的方法,该方法将在接触突变的方法中调用。

  步骤:导入mapmutations->在方法中配置mapmutations

  存储配置文件索引。JS:操作:

  这里有两种配置:

  1.组件中的方法名称和突变中的相应方法名称不同。

  2.组件中的方法名称与突变中的相应方法名称相同。

  对象写作:

  数组写作: