0

使用电极-confippet 库,https://github.com/electrode-io/electrode-confippet - 有什么方法可以在反应组件中使用配置设置客户端?

我目前正在创建一个配置存储并从服务器索引文件传递它,但有更好的方法吗?

//index-view.js
import { config } from 'electrode-confippet';
const auth0Config = config.$('settings.auth0');

function createReduxStore(req, match) { // eslint-disable-line
  const initialState = {
    user: null,
    checkBox: { checked: false },
    number: { value: 999 },
    config: { auth: auth0Config },
  };

  const store = createStore(rootReducer, initialState);
  return Promise.resolve(store);
}
4

1 回答 1

1

是的!我们目前正在这样做:

// src/server/views/index-view.js
// …
module.exports = (req) => {
    const app = (req.server && req.server.app) || req.app;

    if (!app.routesEngine) {
        app.routesEngine = new ReduxRouterEngine({
            routes,
            createReduxStore,
            stringifyPreloadedState
        });
    }

    return app.routesEngine.render(req);
};

这将在对 Express 的每个请求中提供它。

如果您需要在初始化期间设置应用程序所需的配置参数,还要在其中创建商店express-server.js(并在其中重新创建它index-view.js以避免交叉连接污染)。

// express-server.js
// …
const loadConfigs = (userConfig) => {
    if (_.get(userConfig, 'plugins.electrodeStaticPaths.enable')) {
        // eslint-disable-next-line no-param-reassign
        userConfig.plugins.electrodeStaticPaths.enable = false;
    }

    return Confippet.util.merge(Confippet.config, userConfig);
};

// fetch appContext FIRST because components may need it to load, eg: language
const createReduxStore = (config) => store.dispatch({
        type: 'ADD_INITIAL_STATE',
        payload: { appContext: config.$('storeConfig') },
    })
    // eslint-disable-next-line no-console
    .catch(error => console.error('DISPATCH ERROR:', error))
    // return the now-hydrated store
    .then(() => store);

module.exports = function electrodeServer(userConfig, callback) {
    const promise = Promise.resolve(userConfig)
        .then(loadConfigs)
        .then(createReduxStore)
        // …

    return callback ? promise.nodeify(callback) : promise;
};

然后 Electrode 将使其可用,例如window.__PRELOADED__

于 2017-04-19T17:50:07.090 回答