学RN的同学知道，在组件的render方法中我们可以通过JSX来定义组件的具体布局和显示（ JSX 用于在 JavaScript 中定义页面视图结构，它采用层层嵌套的语法组织页面。）并且我们可以在 JSX 中写 JavaScript，则需要将 JS 代码包在一个中括号里面。但如果我们的组件比较复杂，需要根据不同的条件设置不同的样式，比如我们的组件有个bottomView，如果它的状态是可操作的，那么我们底部就显示操作按钮，否则就用文本组件显示异常报错。如果直接使用if else判断是不可以的。但是可以使用三目运算，比如：
错误示范：
<View style={styles.container}>
if(this.props.canHandle) {
<TouchableOcapacity....../>
} else {
<Text ....></Text>
}
</View>
正确示范：
<View style={styles.container}>
{this.props.canHandle ? <TouchableOcapacity....../> : <Text ....></Text>}
</View>
上面是一种 方式，但三目运算也只能判断条件是与否，如果过于复杂的判断，比如bottomView可能会有多种不同的方式布局，我们需要用if else if esle if .. else这样的判断该怎么办呢？前面我们讲过可以在JSX中插入js，那么我们可以将这些判断放在js方法中，然后return我们判断好的组件就行了，比如
<View style={styles.container}>
{this._renderBottom()}
</View>
_renderBottom() {
if(this.props.type === 1){
return <Text.....>alaa</Text>
} else if (this.props.type === 2){
return <View..../>
} else if (...) else{..}
}
参考链接：(https://stackoverflow.com/questions/40477245/is-it-possible-to-use-if-else-statement-in-react-render-function)
(https://facebook.github.io/react/docs/conditional-rendering.html)
