使用Graphql包装的React导出的const的未定义错误

时间:2018-06-10 15:15:56

标签: reactjs graphql react-apollo

我被困住了。我需要确定用户是否经过身份验证。我有一个组件ProtectedRoute包装LinkList。只有ProtectedRoute验证用户身份验证后,LinkList才会显示。

我的整体问题虽然非常简单。出于某种原因,我的#34; me"没有进入我的ProtectedRoutes。获取无法阅读的财产' MeUser'未定义的。

我验证了graphql工作正常。我认为错误可能与“我”有关。由于某种原因没有被传递到ProtectedRoutes。

组件和...休息进入ProtectedRoutes很好,当我做console.log时我可以看到它们。

感谢您的考虑。

以下是相关代码:

ProtectedRoute.js

import * as React from 'react';
import { Route, Redirect } from 'react-router-dom';
import meQueryWrap from '../queries/apimequery';

export const ProtectedRoute = ({ me, component: Component, ...rest }) => {   
  const isAuthenticated = !!me.MeUser;  // this always shows me an undefined error

  return (

    <Route
      {...rest}
      render={props =>
        isAuthenticated ? (
          <div>
            <Component {...props} />
          </div>
        ) : (
          <Redirect
            to={{
              pathname: '/login',
              state: { from: props.location }
            }}
          />
        )
      }
    />
  );
};

export default meQueryWrap()(ProtectedRoute);

apimequery.js

import { graphql } from 'react-apollo';
import gql from 'graphql-tag';

export const graphQlOp = gql`
  query MeQuery {
    meUser {
      id, email, name
    }
  }
`;

const apiMeQueryWrap = (key = 'me') => graphql(graphQlOp, {name: key});

export default apiMeQueryWrap;

0 个答案:

没有答案