2017-04-02 50 views
0

我試圖顯示一個包含數字的嵌套數組。該數組有6個元素(數組)。每個嵌套數組包含6個其他元素/數字。我試圖在Square組件中顯示每個數字。我有一個錯誤:this.props.inGrid.foreach不是一個函數。react-native - this.porps.inGrid不是函數

import React, { Component, PropTypes } from 'react'; 
import { View, StyleSheet } from 'react-native'; 
import Square from './Square'; 
import * as globalStyles from '../styles/global'; 


export default class Grid extends Component { 

    render() { 
    const row = []; 
    this.props.inGrid.foreach((r, i) => { 
     row.push(
     <Square key={i} sqValue={r[i]} /> 
    ); 
    }); 
    return (
     <View style={styles.grid}> 
     {row} 
     </View> 
    ); 
    } 

} 

Grid.propTypes = { 
    numbers: PropTypes.object 
}; 

const styles = StyleSheet.create({ 
    grid: { 
    backgroundColor: globalStyles.BG_COLOR, 
    flexDirection: 'row', 
    padding: 20, 
    justifyContent: 'center' 
    } 
}); 

下面是方形組件:

import React, { PropTypes } from 'react'; 
import { View, Text, StyleSheet } from 'react-native'; 
import * as globalStyles from '../styles/global'; 


const Square = ({ sqValue }) => { 
    return (
    <View style={styles.square}> 
     <Text>{sqValue}</Text> 
    </View> 
); 
}; 

Square.propTypes = { 
    sqValue: PropTypes.number 
}; 

const styles = StyleSheet.create({ 
    square: { 
    backgroundColor: globalStyles.BAR_COLOR, 
    width: 50, 
    height: 50, 
    borderWidth: 1, 
    borderStyle: 'solid', 
    borderColor: 'red' 
    } 
}); 
export default Square; 

我在做什麼錯?

+0

,它看起來像'inGrid'實際上不是的渲染功能是時間數組運行。我會去看一個組件,看看在第一次創建Grid組件時是否有數據不存在的可能性。例如,如果該數據來自api,並且在數據返回之前呈現網格。 編輯: 罷工所有......你打電話給'foreach'和函數應該叫'forEach' –

回答

1

看來,你打電話: this.props.inGrid.foreach 但基於錯誤的函數實際上是所謂forEach

+0

就是這樣。謝謝。愚蠢的錯誤 – Wasteland