理解React-Redux Toolkit语法吗?

Question

我是react, redux的新手，并试图理解我遵循的redux工具包教程。我的切片如下所示。

const initialState = {
count: 0,
};
export const counterSlice = createSlice({
name: "counter",
initialState,
reducers: {
increment: (state) => {
state.count += 1;
},
},
});
export const { increment } = counterSlice.actions;
export default counterSlice.reducer;
export const incrementTest = () => (dispatch) => {
dispatch(increment());
};

然后我使用incrementTest动作如下

<button onClick={() => dispatch(incrementTest())}> + </button>

我想了解以下内容。

下面的函数

export const incrementTest = () => (dispatch) => {
dispatch(increment());
};

我们返回一个参数为dispatch的函数，然后调用提供dispatch函数的另一个函数increment的参数，该函数在上面定义并导出。

然而，当我们调用这个函数时，我们使用dispatch(incrementTest())提供incrementTest作为dispatch的参数。我不明白这个概念。我应该进一步学习javascript中的哪个概念来学习这个?

incrementreducer也以state作为参数(在某些情况下action也是)。谁提供这个(state,action)给这个函数我们称之为dispatch(incrementTest())

Answer 1

export const incrementTest = () => (dispatch) => {
dispatch(increment());
};

是一个thunk的例子，一个函数被调用(由redux中间件)有两个参数，dispatch和getState。它通常用于协调异步工作，因为您可以在函数内await内容或处理承诺。如果您想了解更多信息，请查阅thinkmiddleware。我不确定他们为什么要这么做，没有必要，可能是测试。

对于你的第二个问题，库可以。你所要做的就是用一个动作调用dispatch()，库用当前状态和你的动作调用reducer函数。把它想象成发射一个事件。您的工作是创建事件，库负责相应地更新全局状态。减速器是声明式编写的。如"如果发生了特定事件，全局状态需要如何改变?"。