优化context的使用

src/containers/App.js

 import React, { useState } from 'react';
 import { Switch, Route } from 'react-router-dom';
-import UserInfoContext, { initUserinfo } from '../context/userinfo-context';
+import { UserProvider } from '../context/userinfo-context';
 
 import NavBar from '../components/NavBar';
 import Index from './Index/Index';
@@ -11,19 +11,10 @@ import BindEquipment from './BindEquipment';
 import NoMatch from './NoMatch';
 
 function App() {
-  const [userinfo, setUserinfo] = useState(initUserinfo);
   const [title, setTitle] = useState('多彩运维');
   return (
     <div className='App'>
-      <UserInfoContext.Provider
-        value={{
-          userinfo: userinfo,
-          updateUserInfo: val =>
-            setUserinfo({
-              ...userinfo,
-              ...val,
-            }),
-        }}>
+      <UserProvider>
         <Route render={props => <NavBar {...props} title={title} />} />
         <Switch>
           <Route
@@ -49,7 +40,7 @@ function App() {
           />
           <Route component={NoMatch} />
         </Switch>
-      </UserInfoContext.Provider>
+      </UserProvider>
     </div>
   );
 }

src/containers/Login/index.js

@@ -21,7 +21,6 @@ export class Index extends React.Component {
   }
 
   componentWillMount() {
-    console.log(this.props);
     const { setTitle, updateUserInfo } = this.props;
     setTitle('登陆');
     const { code } = this.props;

src/context/userinfo-context.js

-import React from 'react';
+import React, { createContext, useState } from 'react';
 
 function is_weixn() {
   var ua = navigator.userAgent.toLowerCase();
@@ -21,9 +21,24 @@ export const initUserinfo = {
   },
 };
 
-export const UserContext = React.createContext({
-  userinfo: initUserinfo,
-  updateUserInfo: () => {},
-});
+export const UserContext = createContext();
+
+export const UserProvider = props => {
+  const [userinfo, setUserinfo] = useState(initUserinfo);
+
+  return (
+    <UserContext.Provider
+      value={{
+        userinfo: userinfo,
+        updateUserInfo: val =>
+          setUserinfo({
+            ...userinfo,
+            ...val,
+          }),
+      }}>
+      {props.children}
+    </UserContext.Provider>
+  );
+};
 
 export default UserContext;