Не удалось заставить работать Relay с React Native
Я пытаюсь настроить базовый проект React Native Relay. Я создаю эту проблему, потратив достаточно времени, пытаясь отладить проблему без какой-либо удачи. Я получаю это предупреждение на консоли, и мое реагирующее нативное приложение не может звонить на сервер GraphQL.
Warning: RelayNetworkLayer: Call received to injectImplementation(), but a layer was already injected.
Running application "ExampleApp" with appParams: {"rootTag":1,"initialProps":{}}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF
fetchWithRetries(): Still no successful response after 1 retries, giving up.
Вот мой код
index.ios.js
import React, { Component } from 'react';
import Relay from 'react-relay';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
import App from './app';
import AppRoute from './route/appRoute';
Relay.injectNetworkLayer(
new Relay.DefaultNetworkLayer("http://localhost:1337/graphy")
);
class ExampleApp extends Component {
render() {
return (
<Relay.RootContainer
Component={App}
route={new AppRoute()}
/>
);
}
}
AppRegistry.registerComponent('ExampleApp', () => ExampleApp);
appRoute.js
'use strict';
import Relay from 'react-relay';
export default class extends Relay.Route {
static queries = {
page: (Component) => Relay.QL`
query {
posts(offset: 0) { ${Component.getFragment('page')} }
}
`,
};
static routeName = 'AppRoute';
}
app.js
'use strict';
import React, {Component} from 'react';
import Relay from 'react-relay';
import {
View,
Text,
} from 'react-native';
class App extends Component {
render() {
console.log('props', this.props);
return(
<View>
<Text>Testing</Text>
</View>
);
}
}
export default Relay.createContainer(App, {
fragments: {
page: () => Relay.QL`
fragment on Viewer {
posts { id, title }
}
`,
}
});
package.json
{
"name": "ExampleApp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"babel": "^6.5.2",
"babel-preset-react-native": "^1.8.0",
"babel-relay-plugin": "^0.8.1",
"react": "^0.14.8",
"react-native": "^0.25.1",
"react-relay": "^0.8.1"
}
}
babelRelayPlugin.js
const getBabelRelayPlugin = require('babel-relay-plugin');
const schema = require('../schema.json');
module.exports = { plugins: [getBabelRelayPlugin(schema.data)] };
Вот полная ссылка на репо: https://github.com/popstand/react-native-relay-graphql-example
Подобный код, созданный с помощью ReactJS и Relay, хорошо работает на веб-странице. Я не могу заставить его работать на React Native. Что здесь может пойти не так, что вызывает эту проблему?
2 ответа
Я хотел бы предложить вам проверить приложение F8 на Facebook. Определенно есть сценарий установки, основной маршрут, контейнер ретрансляции и схема.
Возможно, ваш сервер GraphQL возвращает неверный ответ. Это случилось со мной, и я решаю с отладкой сервера (с этим).
Вы можете увидеть код этого примера приложения в: https://github.com/danielfeelfine/react-native-relay