存储提取的数据，以避免每次重新加载组件时提取数据

我有一个应该在不同的视图中使用的 React 组件。这个组件是具有很长选项列表的 Select 元素，我通过 ajax 调用从 db 加载此列表。对于所有视图，使用相同的选项列表选择。我的问题是我不明白如何强制此 Select 仅加载此列表一次，并将其重用于其他渲染。现在看起来有点像这样(很简单，显然(：

var SelectField = React.createClass({
        loadListFromServer: function () {...}
        getInitialState()
        {
            return {
                options: [],
            };
        },
        componentDidMount() {
            this.setState({
                options: this.loadListFromServer()
            });
        },
        render: function () {
          return (
          <div>
             <Select options={this.state.options} />
          </div>
            );
        }
    })
    ;
var Index = React.createClass({
    render: function () {
        return (
                    <SelectField />
        );
    }
});
var Content = React.createClass({
    render: function () {
        return (
                    <SelectField />
        );
    }
});
    ReactDOM.render(
        <Router history={createBrowserHistory()}>
            <Route path="/" component={Index}/>
            <Route path="path" component={Content}/>
        </Router>,
        document.getElementById("container")
    )

我试图做的是：使options和loadListFromServer()全球化，并从window.init中调用loadListFromServer()。然后Index渲染空options，因为它在一切都已经挂载时被填充。那么实现它的一般方法是什么？谢谢，如果我的问题很愚蠢，我很抱歉 - 我刚刚开始这个话题。