设置一个 cookie 以响应 true 的所有时间

如何解决设置一个 cookie 以响应 true 的所有时间

我想将 cookie 设置为始终为真，而不是在发生某些事情或单击某些事情时。

所以有很多关于这个的教程和文章。就我而言，它应该类似于：'mySpecialCookie = true'。

安装包：npm install react-cookie

是否需要同时在 index.js 和 App.js 中导入？

我的 index.js 看起来像这样：

import React from 'react';
import ReactDOM from 'react-dom';
import configureStore from './store/configureStore';
import getMiddlewares from './middlewares';
import App from './containers/App';
import * as serviceWorker from './serviceWorker';

const storeConfig = configureStore(getMiddlewares());

ReactDOM.render(
  <storeConfig.Provider store={storeConfig.store}>
    <App />
  </storeConfig.Provider>,document.getElementById('root')
);

serviceWorker.unregister();

所以我认为在 ReactDOM 里面应该改成这个？

import { CookiesProvider } from "react-cookie";
...
ReactDOM.render(
  <storeConfig.Provider store={storeConfig.store}>
    <CookiesProvider>
      <App />
    </CookiesProvider>
  </storeConfig.Provider>,document.getElementById('root')
);

在 App.js 中，我使用 useCookies 钩子添加了它，但不知道在哪里使用它：

import React,{ useEffect } from 'react';
import { useCookies } from 'react-cookie'; //// <---   added it here 
import { IntlProvider } from 'react-intl';
import { useSelector,shallowEqual,usedispatch } from 'react-redux';
import { browserRouter as Router,Route } from 'react-router-dom';

import Main from './Main';
import OrderDetails from './OrderDetails';
import { fetchDictionary } from '../actions/dictionary';
import { getLanguageCode } from '../utils';
import { HOME_PAGE,ORDER_DETAILS } from '../constants/routes';

const App = () => {
  const dictionary = useSelector((state) => state.dictionary,shallowEqual);
  const routes = [
    { path: HOME_PAGE,component: Main },{ path: `${ORDER_DETAILS}/:id`,component: OrderDetails }
  ];
  const dispatch = usedispatch();

  const [mySpecialCookie,setMySpecialCookie] = useCookies(true);  //// <---   added it here 

  useEffect(() => {
    dispatch(fetchDictionary(getLanguageCode()));
  },[dispatch]);

  return (
    <IntlProvider
      key={dictionary.locale}
      locale={dictionary.locale}
      messages={dictionary.messages}>
      <Router>
        {routes.map((route,index) => (
          <Route
            key={index}
            path={route.path}
            exact
            component={route.component}
          />
        ))}
      </Router>
    </IntlProvider>
  );
};

export default App;

有什么建议吗？

解决方法

我找到了一种使用 js-cookie 的更短的方法。

在 App.js 文件中：

...
import Cookies from 'js-cookie';
...

const App = () => {
   ...
   Cookies.set('mySpecialCookie',true);
   ...
}