注:私は美しいライブラリのreact-railsを使用していますが、私の問題を理解している限り、答えに影響を与えるべきではありません。
<Component />
これは<Map />
、サーバー側では意味がないため、クライアント側のレンダリングを意味します(少なくとも私が使用しているライブラリはそうしません)。
代わりに、クライアント側の準備が整う前に画像を表示して、スキューモーフィズムの原則を適用したいと考えています。
基本的に、これは私が持っていることを意味します:
var Component = React.createClass({
render: function() {
var content;
if (this.state.clientSideReady) { // How can I change my component state here?
content = <Map />
} else {
content = <PlaceholderImage />
}
return (<div>{content}</div>)
}
});
私の現在の理解でcomponentDidMount
は、テンプレート文字列が生成されるときにサーバー側で呼び出されます。コンポーネントが実際にクライアント側にマウントされていることを確認して、画像を実際のマップに置き換えるにはどうすればよいですか?