Question

我们虽然已经创建了个 socket.io 连接，但我们并没有用它获取任何数据。每当我们连接到服务端或服务端发生
状态数据改变时，服务端会发送 state 事件给客户端。我们只需要监听对应的事件即可，我们在接受到事件通知后
只需要简单的对我们的 Store 指派 SET_STATE action 即可：

//src/index.jsx

import React from 'react';
import Router, {Route, DefaultRoute} from 'react-router';
import {createStore} from 'redux';
import {Provider} from 'react-redux';
import io from 'socket.io-client';
import reducer from './reducer';
import App from './components/App';
import {VotingContainer} from './components/Voting';
import {ResultsContainer} from './components/Results';

const store = createStore(reducer);

const socket = io(`${location.protocol}//${location.hostname}:8090`);
socket.on('state', state =>
  store.dispatch({type: 'SET_STATE', state})
);

const routes = <Route handler={App}>
  <Route path="/results" handler={ResultsContainer} />
  <DefaultRoute handler={VotingContainer} />
</Route>;

Router.run(routes, (Root) => {
  React.render(
    <Provider store={store}>
      {() => <Root />}
    </Provider>,
    document.getElementById('app')
  );
});

注意我们移除了 SET_STATE 的硬编码，我们现在已经不需要伪造数据了。

审视我们的界面，不管是投票还是结果页面，它们都会显示服务端提供的第一对选项。服务端和客户端已经连接上了！