如何使减速机设置状态？

Question

我有菜单

const [items, setItems] = useState([
  {id: uuid_v4(), isOpen: false},
  {id: uuid_v4(), isOpen: false}
])

我使用了一个减速器

const menuReducer = (state = items, action) => {
  switch(action.type) {
    case "open":
      const newState = state.map(i=> {
        if(i.id === action.payload) {
          return {...i, isOpen:true}
        } else {
          return {...i, isOpen:false}
        });
      setItems(newState); // <- Why do I need to do this?
      return newState;
    default:
      throw new Error();
  }
}

我需要一个 reducer 来使用上下文，这样我就可以使用菜单项中的调度，这样他们就可以向父级发送“打开我并关闭其他所有人”事件

export const MenuDispatcher = React.createContext(null);
export default function MenuWindow() {
  
  ...

  return (
      <MenuDispatcher.Provider value={dispatch}>
        <div id="MenuWindow" className="menu_container">
           <div className="items_container">
              {
                items.map(
                  ({ id,isOpen }) =>
                    <MenuItem key={id} id={id} isOpen={isOpen} />
                   )
               }
            </div>
         </div>
      </MenuDispatcher.Provider>
    );
}

菜单项：

function MenuItem(props) {
    const dispatch = useContext(MenuDispatcher);

    const handleOnClick = (ev) => {
        ev.preventDefault();
        dispatch({ type: "open", payload: props.id })
    }
    return (
        <div className="menu_item" onClick={handleOnClick}>
        </div>
    );
}

而且我想知道，有没有办法不需要执行 setItems(newState) 而只需让 reducer 设置该状态？我的方法很差吗？