Javascript reducer中未触发redux toolkit操作

我试图使用@reduxjs/Toolkit触发一个简单的操作，但它不起作用

我看到动作被调度了，但好像切片缩减器没有听到它或其他什么

const say = createAction("ui/say", what => ({ payload: what }));

const uiSlice = createSlice({
  name: "ui",
  initialState: { said: "" },
  reducers: {
    [say.type]: (state, action) => {
      console.log("saying", action.payload); //<-- not showing, why?
      state.currentList = action.payload;
    }
  }
});

const store = configureStore({
  reducer: combineReducers({
    ui: uiSlice.reducer
  })
});

const Chat = () => {
  const dispatch = useDispatch();
  const [whatToSay, setWhatToSay] = useState("");
  const whatWasSaid = useSelector(state => state.ui.said);

  const onSubmit = e => {
    e.preventDefault();
    dispatch(say(whatToSay));
    setWhatToSay("");
  };

  return (
    <div>
      <form onSubmit={onSubmit}>
        <input type="text" onChange={e => setWhatToSay(e.target.value)} />
        <button>Say</button>
      </form>
      {whatWasSaid ? <p>You said: {whatWasSaid}</p> : <p>Say something</p>}
    </div>
  );
};

const say=createAction（“ui/say”，what=>（{payload:what}））；
const uiSlice=createSlice({
名称：“用户界面”，
initialState:{说：}，
减速器：{
[say.type]：（状态、动作）=>{
console.log（“saying”，action.payload）；//{
const dispatch=usedpatch（）；
const[whatToSay，setWhatToSay]=使用状态（“”）；
const whatWasSaid=useSelector（state=>state.ui.said）；
const onSubmit=e=>{
e、 预防默认值（）；
发送（说什么）；
setWhatToSay（“”）；
};
返回(
setWhatToSay（e.target.value）}/>
说
{whatWasSaid？你说：{whatWasSaid}
：说点什么
}
);
};

下面是一个最小的复制示例：

---

我认为你的答案不匹配

在代码中，您试图实现一个操作的侦听器，因此您可能希望改用

extraReducers

：

const uiSlice = createSlice({
  name: "ui",
  initialState: { said: "" },
  // Not reducers: {}
  extraReducers: {
    [say.type]: (state, action) => {
      console.log("saying", action.payload);
      state.currentList = action.payload;
    }
  }
});

注意

createSlice

API的

reducers

prop：

reducers: Object<string, ReducerFunction | ReducerAndPrepareObject>

：使用

createSlice

，reducers字段用于定义reducer并生成与这些reducer匹配的操作。

extralreducers

字段用于处理已在别处定义的操作

---

我以为ExtraReducer只是用来处理异步操作的（从文档中）。现在我很困惑：为什么有两种类型，我们应该在什么时候使用它们？还有，Reducer：{say}既然say是一个动作创建者，那么工作？我们如何设置所说的状态字段？对于使用

CreateAynchThunk

API的异步动作，

ExtraReducer

用于生成减缩器，但这取决于片中以外的其他动作，在本例中，放置

say

动作是无用的。文档中有很多例子，不是explain bettery你问得很好，有很多问题，所以请打开新的线程，我回答了原来的问题，我们应该关注这个问题。是的，你是对的，

{say}

应该来自

createReducer

，我的错。要进一步扩展：使用

createSlice

，

reducers

字段用于定义reducer并生成与这些reducer匹配的操作。

extraducers

字段用于处理其他地方已定义的操作。

const say = (state, payload) => {
  console.log("saying", payload);
  state.currentList = payload;
};


const uiSlice = createSlice({
  name: "ui",
  initialState: { said: "" },
  reducers: { say }
});

// Usage
dispatch(uiSlice.actions.say(whatToSay));