UnhandledPromiseRejectionWarning：语法错误：React Native

Question

呈现视图时遇到问题。试图在JSX中填充二维数组。

示例代码：

export default class ItemListScreen extends Component {

    imagesArrayToGridArray(totalColumns) {
        const albums = [
                {
                    id: 1,
                    name: 'wahid'
                },

                {
                    id: 2,
                    name: 'sayem'
                },

                {
                    id: 3,
                    name: 'amanot'
                },

                {
                    id: 4,
                    name: 'shimul'
                }
            ]
        let gridArray = [[]];

        let countColumns = 1;
        for (var i = 0; i < albums.length; i++) {
            gridArray[gridArray.length - 1].push(albums[i])
            if (countColumns <= totalColumns) {
            countColumns++;
        }
        if (countColumns > totalColumns && i !== albums.length - 1) {
            countColumns = 1
            gridArray.push([])
        }

        return gridArray
    }

    renderGrid(gridArray) {
        return gridArray.map(row => (
          <Row>{row.map(col => console.log({col}))}</Row>
        ))
    }

    renderView() {
        let gridArray = this.imagesArrayToGridArray(2)
        return <Grid>{this.renderGrid(gridArray)}</Grid>
    }

    render() {
        const { contents } = styles;
        return (
                    {
                        this.renderView()
                    } 
        );
    }
}

在Metro bundler中出现以下错误：

  

（节点：3956）UnhandledPromiseRejectionWarning：语法错误：E：/projects/NewProject/app/screens/ItemListScreen.js：意外的令牌，应为； （60:26）

我想将数组布置为两个D数组：

<Row>
  <Col>Wahid</Col>
  <Col>Sayem<Col>
</Row>
<Row>
  <Col>Amanot</Col>
  <Col>Shimul<Col>
</Row>

已经从下面的链接中得到了这个主意。但是在尝试实施时仍然面临问题： NativeBase: Generate Columns in Row