选项1(简单):
您可以将代码移动到一个方法:
getAlerts() {
if (this.props.displayGenericAlerts && this.props.genericAlerts.length > 0) {
return this.props.genericAlerts.map((alert, index) => <AlertPanel key={index} alert={alert} index={index} />);
} else if (this.state.alerts.result && this.state.alerts.result.length > 0) {
return this.state.alerts.result.map((alert, index) => <AlertPanel key={index} alert={alert} index={index} />);
} else if (!alertResource.isError() && !alertResource.isLoading() && this.state.accountAlert) {
return alertResource.get("content").map((alert, index) => <AlertPanel key={index} alert={alert.toJS()} index={index} />);
} else {
return <span>No Alerts Found</span>
}
}
选项2(花式):
有一个Babel插件(目前处于第0阶段,请使用它)
here
)实现
do-expressions
这样就可以写一个
if/else
链作为一个表达式,所以可以直接与JSX一起使用。
babel-plugin-transform-do-expressions
:
<div>
{do {
if (cond2) {
value1;
} else if (cond2) {
value2;
} else {
value3;
}
}}
</div>
