React Native 和 Apollo:找不到变量:文档

Posted

技术标签:

【中文标题】React Native 和 Apollo:找不到变量:文档【英文标题】:React Native and Apollo: Can't find variable: document 【发布时间】:2020-02-25 08:28:03 【问题描述】:

我收到了标题中所述的错误,我不知道如何摆脱它并让我的应用程序正常运行。

我一直在尝试解决它,但还没有找到解决方案。我发现唯一与我的错误有关的是这条评论:“你不能在 React Native 中使用文档,你可以在菜单后面创建一个背景,然后在新闻背景上你可以隐藏它。”法耶德写的。尽管这似乎是我的答案,但我不确定如何创建该背景。这是我的代码:

import React from 'react';
import ReactDOM from 'react-dom';
import Route, Link, BrowserRouter as Router from 'react-router-dom';
import news from './components/News';
import eating from './components/Eating';
import LoginForm from './components/LoginForm';
import ApolloClient from 'apollo-client';
import ApolloProvider from 'react-apollo';
import HttpLink from 'apollo-link-http';
import InMemoryCache from 'apollo-cache-inmemory';

const client= new ApolloClient(
  link: new HttpLink(uri:'https://api-useast.graphcms.com/v1/ck25kwqhb10bg01cx4o1i5czu/master'),
  cache:new InMemoryCache()
)

const routing = (
  <Router>
    <Route path="/" component=LoginForm />
    <Route path="/news" component=News />
    <Route path="/eating" component=Eating />
  </Router>
)


ReactDOM.render((
  <ApolloProvider client=client>
    routing
  </ApolloProvider>
),
  document.getElementById('root')
)

这是我的 package.json 文件:


  "main": "node_modules/expo/AppEntry.js",
  "scripts": 
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  ,
  "dependencies": 
    "apollo-cache-inmemory": "^1.6.3",
    "apollo-client": "^2.6.4",
    "apollo-link-http": "^1.5.16",
    "expo": "^35.0.0",
    "graphql": "^14.5.8",
    "react": "16.8.3",
    "react-apollo": "^3.1.3",
    "react-dom": "^16.8.3",
    "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
    "react-native-web": "^0.11.7",
    "react-router-dom": "^5.1.2"
  ,
  "devDependencies": 
    "babel-preset-expo": "^7.1.0"
  ,
  "private": true

我希望能够无任何错误地加载我的应用程序。

【问题讨论】:

你真的想在这里做 react-native 吗?看起来您正在尝试为 Web 创建一个典型的 React 应用程序。 ReactDOM 用于在 html 节点上插入 react。在移动应用程序的上下文中没有document @FranreySaycon 是的,我错了。我刚刚修好了;必须使用 router-native 而不是 DOM。对不起! 【参考方案1】:

我解决了,我必须下载 react-router-native 而不是 react-router-DOM。就是这样。而不是:

import React from 'react';
import ReactDOM from 'react-dom';
import Route, Link, BrowserRouter as Router from 'react-router-dom';
mport ApolloClient from 'apollo-client';
import ApolloProvider from 'react-apollo';
import HttpLink from 'apollo-link-http';
import InMemoryCache from 'apollo-cache-inmemory';

我必须这样做:

import React, Component from 'react';
import Route, Link, NativeRouter as Router from 'react-router-native';
import ApolloClient from 'apollo-client';
import ApolloProvider from 'react-apollo';
import HttpLink from 'apollo-link-http';
import InMemoryCache from 'apollo-cache-inmemory';

并为类组件替换该 DOM 渲染。

【讨论】:

以上是关于React Native 和 Apollo:找不到变量:文档的主要内容,如果未能解决你的问题,请参考以下文章

将graphql查询响应与react-redux连接,得到ReferenceError:找不到变量

Apollo-client (react) - 更新创建突变 - “在对象 (ROOT_QUERY) 上找不到字段 Fund()”

React Native --- 找不到模块 '@hapi/joi' 需要堆栈

-bash:react-native:找不到命令

-bash:react-native:找不到命令

找不到 react-native 和 create-react-app 的命令(Mac OS)