如何使用@reduxjs/toolkit中的WritableDraft输入助手函数参数？

import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';

// 创建一个异步操作
const fetchUser = createAsyncThunk('user/fetchUser', async (userId, { getState, dispatch }) => {
  // 获取可变的Draft对象
  const state = getState();
  const userDraft = state.user;

  // 更新Draft对象的属性
  userDraft.loading = true;

  // 发起异步请求
  const response = await fetch(`/api/users/${userId}`);
  const data = await response.json();

  // 更新Draft对象的属性
  userDraft.loading = false;
  userDraft.data = data;

  // 返回更新后的状态
  return userDraft;
});

// 创建Slice
const userSlice = createSlice({
  name: 'user',
  initialState: { loading: false, data: null },
  reducers: {},
  extraReducers: (builder) => {
    // 处理异步操作的状态更新
    builder.addCase(fetchUser.fulfilled, (state, action) => {
      // 更新状态
      return action.payload;
    });
  },
});

// 导出Slice的reducer和异步操作
export const { reducer: userReducer } = userSlice;
export const { fulfilled: fetchUserFulfilled } = fetchUser;

// 使用Redux的configureStore函数创建store
const store = configureStore({
  reducer: {
    user: userReducer,
  },
});

// 在组件中使用异步操作
store.dispatch(fetchUser(123))
  .then(() => {
    // 异步操作完成后的回调函数
    console.log('User data fetched successfully');
  })
  .catch((error) => {
    // 异步操作失败后的回调函数
    console.error('Failed to fetch user data:', error);
  });