* 使用三目运算符
* 设置一个变量并在属性中引用他
* 将逻辑转化到函数中
*使用&&运算符
1. 使用三目运算符
...render(){ return
return <div className={
this.state.isComplete? 'is-complete' : ''
}> ... </div>
}...
2.使用变量
...
getIsComplete(){
return this.state.isComplete ? 'is-complete' : '';
},
render(){
let isComplete-this.getIsComplete();
return <div className={isComplete}>...<div>
}...
3.使用函数
...
getIsComplete(){
return this.state.isComplete ? 'is-complete' : '';
},
render(){
return <div className={this.getIsComplete()}... <div>
}...
4. 使用逻辑（&&）运算符
由于对于null或false值react不会输出任何内容，因此你可以使用一个后面跟随了期望字符串的布尔值来实现条件判断，如果这个布尔值为true，那么后续的字符串会被使用
render(){
return <div className={this.state.isComplete && 'isComplete'}>
...
<div>
}
