Reducer

Reducers规定了Store更新State更新时机，它只说明State的变化过程。

注意

请不要将业务逻辑放在Reducer中，这样会使Reducer变得庞大甚至不纯粹进而不可复用和不好维护。建议将异步操作和业务逻辑放入Action中。

设计reducer

在Slim中，一个Reducer以一个键值对的方式定义，接下来让我们看看如何实现一个Reducer。在我们一个简单的计数器应用中，我们希望有两种操作：

增加计数：increment
减少计数：decrement

import Slim from 'slim-store'

const state = {
    count: 0
}

const counters = {
    increment: (state) => {
        // increment count
    },
    decrement: (state) => {
        // decrement count
    }
}

const store = Slim.createStore({
    reducers: counters,
    state
})

store.commit('increment')

执行Reducer非常简单，执行store.commit(reducerKey, ...arguments)即可。

更新State

那在Reducer中如何更新State？我们提供了两种可行的方式

返回一个全新的State对象

这种纯函数的写法会让整个Reducer变得更可测试，无副作用（不会影响到函数外的参数变化）。但是在及其复杂的State结构下将会使整个操作和性能的成本变高。

increment: (state) => {
    return {
        ...state,
        count: state.count + 1
    }
}

直接在State对象上更改

这种方法在大多数情况下会显得比较简洁和方便。

increment: (state) => {
    state.count++
}

以上方法各有自己的优势和劣势，您可以根据应用中的具体情况选择不同的处理方式。

传入多参数

在使用Reducer的时候，不免会有传入对应参数的需求，在Slim中参数传递也非常的方便

increment: (state, count, times) => {
    return {
        ...state,
        count: count * times   // 20
    }
}

store.commit('increment', 10, 2)

将需要的参数在Reducer函数入参中直接注册，在store.commit中直接使用逗号分隔传入即可

# Reducer

# 设计reducer

# 更新State

# 返回一个全新的State对象