Relay 的注入网络层在 React 应用程序中未被识别为函数 [英] Relay's Inject Network Layer Not Being Recognized as a Function in a React App

问题描述

我正在学习 Lynda.com 的名为构建和部署全栈 React 应用程序"的教程，在注入中继网络层"一章中，index.js 尝试建立网络层，程序编译成功，但我在浏览器中收到以下错误:

I am following along a Lynda.com tutorial called "Building and Deploying a Full-Stack React Application", and in the chapter "Injecting the Relay Network Layer" there is in index.js, an attempt to set up a network layer, and the program compiles successfully but I'm receiving the following error in the browser:

类型错误:__WEBPACK_IMPORTED_MODULE_4_react_relay___default.a.injectNetworkLayer 不是函数

有什么想法吗?我会很感激，厘米

Any ideas? I'd appreciate it, CM

(我的 index.js 文件)

(My index.js file)

import React from 'react'
import ReactDOM from 'react-dom'
import {Router, browserHistory, applyRouterMiddleware} from 'react-router'
import Routes from './routes'
import Relay from 'react-relay'
import useRelay from 'react-router-relay'
import {RelayNetworkLayer, urlMiddleware} from 'react-relay-network-layer'
import {relayApi} from './config/endpoints'
import auth from './utils/auth'

const createHeaders = () => {
  let idToken = auth.getToken()
  if (idToken) {
    return {
      'Authorization': `Bearer ${idToken}`
    }
  } else {
    return {}
  }
}

Relay.injectNetworkLayer(
  new RelayNetworkLayer([
    urlMiddleware({url: (req) => relayApi,}),
        next => req => {
          req.headers = {
            ...req.headers,
            ...createHeaders()
          }
          return next(req)
      },
  ],{disableBatchQuery: true})
)

ReactDOM.render(
  <Router
    environment={Relay.Store}
    render={applyRouterMiddleware(useRelay)}
    history={browserHistory}
    routes={Routes}
  />,
  document.getElementById('root')
)

推荐答案

您可能没有使用正确的 Relay 版本，但这只是一个猜测.检查教程是否指定了任何版本并检查您使用的是哪个版本.

You are probably not using the right version of Relay, but its just a guess. Check if the tutorial specifies any version and check which one you are using.

在 Relay 的最新版本:Relay-Modern 中发生了很多变化.您可能想研究一下，它比 Relay-Classic 更方便、更高效.

A lot of things changed in the last version of Relay: Relay-Modern. You might want to look into that, its way more convenient and efficient than Relay-Classic.

还有更简单的方法可以将路由器与中继相结合.在路由器的正上方或下方创建中继环境，具体取决于您是否需要从数据库中获取路由.但我想你只需要完成教程即可.

Also there are easier ways to combine a router with relay. Create your Relay Environment directly above or below your router, depending on if you need to get routes out of your db. But I guess you just need to get through the tutorial.

这篇关于Relay 的注入网络层在 React 应用程序中未被识别为函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！