0
タブを使用して反応コンポーネントを作成しました。初期ロードでは機能しませんが、ページをリロードすると機能します。タブ/タブが反応マテリアライズの初期ロードで機能しない
私は機能をレンダリング私はルータを使用して反応するコンポーネントをロードする際
<Tabs className='tab-demo z-depth-1'>
<Tab title="Components" active>
<form className="col s12">
<div className="row">
<div className="input-field col s5">
<input id="file_search" type="text" className="validate" />
<label htmlFor="file_search">Search</label>
</div>
<div style={styles.restorecomp}>
<span className="btn indigo darken-4 selectdrop" onClick={this.open}><i className="material-icons left">restore</i> Restore a Component</span>
<span className="btn indigo darken-4 selectdrop" onClick={this.save} ><i className="material-icons left">save</i> Save</span>
</div>
</div>
</form>
<table className="highlight centered" id="files">
<thead>
<tr>
<th data-field="comp"> Name</th>
<th data-field="type">Type</th>
<th data-field="version">Version</th>
<th data-field="user">Data Source</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</Tab>
<Tab title="Data Sources">
<form className="col s12">
<div className="row">
<div className="input-field col s5">
<input id="ds_search" type="text" className="validate" />
<label htmlFor="ds_search">Search</label>
</div>
<div style={styles.restorecomp}>
<span className="btn indigo darken-4 selectdrop" onClick={this.dsopen}><i className="material-icons left">restore</i> Restore DataSource</span>
<span className="btn indigo darken-4 selectdrop" onClick={this.save}><i className="material-icons left">save</i> Save</span>
</div>
</div>
</form>
<table className="highlight centered" id="ds">
<thead>
<tr>
<th data-field="comp"> Alias</th>
<th data-field="tname"> Name</th>
<th data-field="connection">Connection</th>
<th data-field="type">Type</th>
<th data-field="version">Version</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</Tab>
<Tab title="Files">
<form className="col s12">
<div className="row">
<div className="input-field col s5">
<input id="fv_search" type="text" className="validate" />
<label htmlFor="fv_search">Search</label>
</div>
<div style={styles.restorecomp}>
<span className="btn indigo darken-4 selectdrop" onClick={this.fileopen}><i className="material-icons left">restore</i> Restore a File</span>
<span className="btn indigo darken-4 selectdrop" onClick={this.save}><i className="material-icons left">save</i> Save</span>
</div>
</div>
</form>
<table className="highlight centered" id="fv">
<thead>
<tr>
<th data-field="comp">Name</th>
<th data-field="type">Path</th>
<th data-field="version">Version</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</Tab>
</Tabs>
以下のようにタブがロードされていないが、私は手動でページを更新した場合、それは完全にロードされます。