React native 如何在react native的嵌套映射函数中使用if-else条件？

我正在制作一个react原生应用程序，它有一个像网格视图一样的自定义视图。除一个单元外，视图的所有单元都具有相同的大小。我想给出一个条件，使单元格的大小比其他单元格的大小大一倍。
我正在通过一个使用map函数的数组进行查看。映射函数不接受if语句。我应该如何使用它

// Buttons Array
buttons = [['1', '2', '3'],
           ['a', 'b', 'c'],
           ['q', 'w', 'e'],
           ['+', '-', '*'],
          ]
// '-' has double size...
import React, { Component } from 'react';
import {
    View,
    Text,
    TouchableNativeFeedback
} from 'react-native';

//Styles
import styles from './styles';

export default class NumberButtons extends Component {



    //This will call the bound function from its parent component 
    //to handle button press action/event 
    _handleOnPress = (value) => {
        requestAnimationFrame(() => {
            this.props.onBtnPress(value);
        });
    }

    render() {
        return (
            <View style={styles.container}>
                {
                    this.props.buttons.map((row, index) => (
                        <View key={index} style={styles.contRow}>
                            { 
                                row.map((col,index) => (
            //**** Here I want to use if else for row and column ***//
                                    <TouchableNativeFeedback
                                        key={index}
                                        onPress={() => this._handleOnPress(col)}
                                        background={TouchableNativeFeedback.SelectableBackground()}>
                                        <View style={styles.buttonContainer}>
                                            <Text style={styles.text}>{col}</Text>
                                        </View>
                                    </TouchableNativeFeedback>
                                ))
                            }
                        </View>
                    ))
                }
            </View>
        );
    }
}

//按钮数组
按钮=['1'，'2'，'3']，
[a'，b'，c']，
[q'，w'，e']，
['+', '-', '*'],
]
//“-”的大小是原来的两倍。。。
从“React”导入React，{Component}；
进口{
看法
文本，
可触摸的自然反馈
}从“反应本机”；
//风格
从“./styles”导入样式；
导出默认类编号按钮扩展组件{
//这将从其父组件调用绑定函数
//要处理按钮按下操作/事件
_handleOnPress=（值）=>{
requestAnimationFrame（（）=>{
this.props.onBtnPress（值）；
});
}
render（）{
返回(
{
this.props.buttons.map（（行，索引）=>(
{ 
行映射（（列，索引）=>(
//****在这里，我想对行和列使用if-else***//
这个.\u handleOnPress（col）}
背景={TouchableNativeFeedback.SelectableBackground（）}>
{col}
))
}
))
}
);
}
}

以下是如何在嵌套映射函数中插入if和else的示例代码

this.props.availableEvents.map（（项目，i）=>{
if（i};您可以像这样渲染条件视图

            <View style={styles.container}>
                 {this.state.buttons.map((row, index) => {
                    const myRow = row
                    console.log("myRow",myRow)
                    return (
                     <View key={index} style={styles.contRow}>
                         {
                             row.map((col,index) => {
                                  if(col != 3 && myRow != null  ){
                                    return (
                                      <TouchableNativeFeedback
                                          key={index}
                                          onPress={() => this._handleOnPress(col)}
                                          background={TouchableNativeFeedback.SelectableBackground()}>
                                          <View style={styles.buttonContainer}>
                                              <Text style={styles.text}>{col}</Text>
                                          </View>
                                      </TouchableNativeFeedback>
                                    )
                                  }
                                  else  {
                                    return (
                                      <TouchableNativeFeedback
                                          key={index}
                                          onPress={() => this._handleOnPress(col)}
                                          background={TouchableNativeFeedback.SelectableBackground()}>
                                          <View style={styles.buttonContainer}>
                                              <Text style={{backgroundColor:'#78909C'}}>{col}</Text>
                                          </View>
                                      </TouchableNativeFeedback>
                                    )
                                  }
                             })
                         }
                     </View>
                 )})
             }
         </View>


{this.state.buttons.map（（行，索引）=>{
常量myRow=行
console.log（“myRow”，myRow）
返回(
{
行映射（（列，索引）=>{
if（col！=3&&myRow！=null）{
返回(
这个.\u handleOnPress（col）}
背景={TouchableNativeFeedback.SelectableBackground（）}>
{col}
)
}
否则{
返回(
这个.\u handleOnPress（col）}
背景={TouchableNativeFeedback.SelectableBackground（）}>
{col}
)
}
})
}
)})
}
我不会以这种方式获取行和列变量。。。我已经试过了。请检查更新的答案。现在可以在条件块中获取行和列的值。希望对你有用@内哈