improvement: allow viewing model when Try-It-Out is enabled (via #4723)

This commit is contained in:
Yuanhai He
2018-07-27 08:47:41 +08:00
committed by kyle
parent 8a86b2f9c3
commit 8cde08bd83
2 changed files with 15 additions and 9 deletions

View File

@@ -15,13 +15,13 @@ export default class ModelExample extends React.Component {
constructor(props, context) {
super(props, context)
let { getConfigs } = this.props
let { getConfigs, isExecute } = this.props
let { defaultModelRendering } = getConfigs()
if (defaultModelRendering !== "example" && defaultModelRendering !== "model") {
defaultModelRendering = "example"
}
this.state = {
activeTab: defaultModelRendering
activeTab: isExecute ? "example" : defaultModelRendering
}
}
@@ -33,6 +33,12 @@ export default class ModelExample extends React.Component {
})
}
componentWillReceiveProps(props) {
if (props.isExecute && props.isExecute !== this.props.isExecute) {
this.setState({ activeTab: "example" })
}
}
render() {
let { getComponent, specSelectors, schema, example, isExecute, getConfigs, specPath } = this.props
let { defaultModelExpandDepth } = getConfigs()
@@ -40,19 +46,19 @@ export default class ModelExample extends React.Component {
return <div>
<ul className="tab">
<li className={ "tabitem" + ( isExecute || this.state.activeTab === "example" ? " active" : "") }>
<a className="tablinks" data-name="example" onClick={ this.activeTab }>Example Value</a>
<li className={ "tabitem" + ( this.state.activeTab === "example" ? " active" : "") }>
<a className="tablinks" data-name="example" onClick={ this.activeTab }>{isExecute ? "Edit Value" : "Example Value"}</a>
</li>
{ schema ? <li className={ "tabitem" + ( !isExecute && this.state.activeTab === "model" ? " active" : "") }>
{ schema ? <li className={ "tabitem" + ( this.state.activeTab === "model" ? " active" : "") }>
<a className={ "tablinks" + ( isExecute ? " inactive" : "" )} data-name="model" onClick={ this.activeTab }>Model</a>
</li> : null }
</ul>
<div>
{
(isExecute || this.state.activeTab === "example") && example
this.state.activeTab === "example" && example
}
{
!isExecute && this.state.activeTab === "model" && <ModelWrapper schema={ schema }
this.state.activeTab === "model" && <ModelWrapper schema={ schema }
getComponent={ getComponent }
getConfigs={ getConfigs }
specSelectors={ specSelectors }