reactjs - 错误：[ThemeProvider] 请将您的主题道具设为普通对象

Question

你好我正在尝试使用情感主题，但是我遇到了这个错误，我无法解决

代码：

const [theme, setTheme] = usePersistedState('theme', light);

  const toggleTheme = () => {
    setTheme(theme.title === 'light' ? dark : light);
  };
  return (
    <ThemeProvider theme={theme}>
      <div className="App">
        <button onClick={toggleTheme}>a</button>
      </div>
    </ThemeProvider>
  );

我的钩子：

function usePersistedState(key, initialState) {
  const [state, setState] = useState(() => {
    const storageValue = localStorage.getItem(key);
    if (storageValue) {
      return JSON.parse(storageValue);
    } else {
      return initialState;
    }
  });
  useEffect(() => {
    localStorage.setItem(key, JSON.stringify(state.type));
  }, [key, state]);

  return [state, setState];
}

我的主题：

黑暗的：

export default {
  type: 'dark',

  colors: {
    primary: '#222',
    secondary: '#DF2935',

    background: '#333',
    text: '#fff',
  },
};

光：

export default {
  type: 'light',

  colors: {
    primary: '#3772FF',
    secondary: '#DF2935',

    background: '#f5f5f5',
    text: '#333',
  },
};

我不知道如何解决这个问题我基本上将我的主题保存在我的本地存储中以便能够保存我的偏好

标签： reactjsemotion