DAY13 资料室--Vuex载荷Payload

前言

为什麽要特别提一下 Payload
是因为像 mutationsactions,其实都只能传一个自定参数进去,如果有多个参数要使用时,可能就会跳错,怕有人也遇到相同的困扰,所以特别提一声。

举例来说,像下面这个范例 state.count += x,只有传递 x 一个参数是没问题的。

// ...
mutations: {
  increment (state, x) {
    state.count += x
  }
}

那如果是这样,传了 x, y两个参数,就会遇到 undefined 的跳错罗!

// ...
mutations: {
  increment (state, x, y) {
    state.count += x * y
  }
}

如果今天我们需要传入多个参数到底怎麽办呢?就可以使用 Payload(载荷)了。
使用方式其实很简单,就是将要传入的参数封装成物件,如下范例

mutationspayload 作为传入的参数

// ...
mutations: {
  increment (state, payload) {
    state.count += payload.x * payload.y
  }
}

使用时传入物件 {x: 5, y: 10}

store.commit('increment', {
  x: 5,
  y: 10
})

这样就可以罗,是不是很简单呢?
虽然看起来很简单,但其实这是运用到ES6的新特性-解构赋值,实际上我对此也是懵懵懂懂,所以无法细说
若有兴趣想深入研究的捧由,可以以此关键字去搜寻研究,也欢迎与我分享罗!


<<:  Day13 javascript 类型转换

>>:  予焦啦!检验核心映像档:开机流程、OpenSBI 惯例、ELF 浅谈

强型闯入DenoLand[25] - 使用 Deno 打造多线程应用(2)

强型闯入DenoLand[25] - 使用 Deno 打造多线程应用(2) 在了解何谓多线程以後,...

Day 14: 人工智慧在音乐领域的应用 (AI作曲-演算法基础概念)

接下来的几天我们会比较详细的介绍几个演算法是如何运用在作曲上,但在我们开始进入演算法作曲之前,我们要...

[Tableau Public] day 13:进阶版的表格呈现方式

第13天,表格不就是栏加列吗,还能变出什麽花样? 没错,tableau public 就是可以~呈现...

Day 07 JavaScript/Rails API

阿修的说文解字 API 的全名是 Application Programming Interface...

Day05 platform channels

编写自定义的平台相关程序码(插件在不同平台的功能实作) Flutter 允许调用相关平台的API,无...