staff_data/apps/web/src/app/main/layout/MainProvider.tsx

39 lines
1.1 KiB
TypeScript

import React, { createContext, ReactNode, useContext, useState } from "react";
interface SelectedTerms {
[key: string]: string[]; // 每个 slug 对应一个 string 数组
}
interface MainContextType {
searchValue?: string;
selectedTerms?: SelectedTerms;
setSearchValue?: React.Dispatch<React.SetStateAction<string>>;
setSelectedTerms?: React.Dispatch<React.SetStateAction<SelectedTerms>>;
}
const MainContext = createContext<MainContextType | null>(null);
interface MainProviderProps {
children: ReactNode;
}
export function MainProvider({ children }: MainProviderProps) {
const [searchValue, setSearchValue] = useState("");
const [selectedTerms, setSelectedTerms] = useState<SelectedTerms>({}); // 初始化状态
return (
<MainContext.Provider
value={{
searchValue,
setSearchValue,
selectedTerms,
setSelectedTerms,
}}>
{children}
</MainContext.Provider>
);
}
export const useMainContext = () => {
const context = useContext(MainContext);
if (!context) {
throw new Error("useMainContext must be used within MainProvider");
}
return context;
};