javascript - Relay 的注入(inject)网络层未被识别为 React 应用程序中的函数

标签 javascript reactjs react-router relay react-router-relay

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

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

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

(我的 index.js 文件)

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,但这只是一个猜测。检查教程是否指定任何版本并检查您使用的是哪个版本。

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

还有更简单的方法可以将路由器与中继结合起来。根据您是否需要从数据库中获取路由,直接在路由器上方或下方创建中继环境。但我想您只需要完成本教程即可。

关于javascript - Relay 的注入(inject)网络层未被识别为 React 应用程序中的函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45702431/

相关文章:

javascript - 为什么onclick的处理函数没有按预期工作?

javascript - react : setting scrollTop property of div doesn't work

reactjs - 如何使用带有 props 的 Jest 来模拟 React 组件?

javascript - 有没有一种方法可以使用按钮来 react 删除存储在状态中的数组中的项目

reactjs - 使用 React Router 时禁用历史记录和 URL 状态

javascript - React Router 和 RxJS 数据流

javascript - 如何检查分配给缺失的匿名函数表达式的变量是否为 null 或 undefined?

javascript - 密码确认Javascript

javascript - 将状态与循环 react 中的对象合并

reactjs - 在react-router转换期间我应该如何更新redux存储?