2017-02-23 2 views
0

私はgraphqlを学習しており、apollo-clientのログソリューションが存在するかどうかを知りたがっています。Apollo GraphQLとredux-loggerと同等の反応

私はredux-loggerがReact/Reduxアプリをデバッグするためのすばらしいツールであると判断し、appolo-clientのソートが存在するかどうかを知りたがっていますか?

いつでも私のstoreの状態を見たいと思います。

答えて

1

もう少し調べてみたはずです。

よくここで説明されています。それは誰にも興味http://dev.apollodata.com/react/redux.html#creating-a-store

場合には、これは私がredux-loggerapollo-clientを実装する方法です。

import React from 'react'; 
import { createStore, combineReducers, applyMiddleware, compose } from 'redux'; 
import thunk from 'redux-thunk'; 
import createLogger from 'redux-logger'; 
import promise from 'redux-promise'; 
import ReactDOM from 'react-dom'; 
import ApolloCient from 'apollo-client'; 
import { ApolloProvider } from 'react-apollo'; 
import reducers from './reducers'; 

import App from './App'; 

// Instantiate Apollo Client 
const client = new ApolloCient(); 

// declare the redux-logger 
const logger = createLogger({ 
    collapsed: true, 
    diff: true, 
}); 

const store = createStore(
    combineReducers({ 
    apollo: client.reducer(), // apollo reducer 
    reducers, // your others reducers 
    }), 
    {}, 
    compose(
    // apply client.middleware() from ApolloClient and logger from redux-logger 
    applyMiddleware(client.middleware(), thunk, promise, logger), 

    // If you are using the devToolsExtension, you can add it here also 
    // window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(), 
) 
); 


const Root =() => { 
    return (
    // pass redux store and apollo client to ApolloProvider 
    <ApolloProvider store={store} client={client}> 
     <App /> 
    </ApolloProvider> 
); 
}; 

ReactDOM.render(
    <Root />, 
    document.querySelector('#root') 
); 
関連する問題