react-native - this.porps.inGrid가 함수가 아닙니다.

숫자가 들어있는 중첩 배열을 표시하려고합니다. 배열에는 6 개의 요소 (배열)가 있습니다. 중첩 된 각 배열은 6 개의 추가 요소/숫자를 포함합니다. 각 숫자를 Square 구성 요소에 표시하려고합니다. 오류가 있습니다 : this.props.inGrid.foreach는 함수가 아닙니다.react-native - this.porps.inGrid가 함수가 아닙니다.

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;

내가 잘못 뭐하는 거지 :

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' 
    } 
});

아래 스퀘어 구성 요소는 무엇입니까?

출처

2017-04-02 Wasteland

라고, 그것은 본다 달리는. 그리드 구성 요소가 처음 생성 될 때 데이터가 존재하지 않을 가능성이 있는지 확인하기 위해 하나의 구성 요소로 이동합니다. 예를 들어, 데이터가 api에서오고 데이터가 반환되기 전에 Grid가 렌더링되고있는 경우입니다. 편집 : 파업 모두 ... foreach를 호출하고 함수는 forEach라고해야합니다. –

그것은 당신이 전화하는거야 나타납니다 : inGrid` 함수는 렌더링하는 시간의 배열이 실제로 아니다`처럼 this.props.inGrid.foreach 을하지만, 함수가 실제로 오류를 바탕으로 forEach

출처

2017-04-03 00:21:26

그게 전부입니다. 감사. 어리석은 실수 – Wasteland

react-native - this.porps.inGrid가 함수가 아닙니다.

답변

관련 문제