Для цикла, не работающего в React Функциональный компонент - PullRequest
0 голосов
/ 23 октября 2019

У меня есть компонент, который предназначен для вывода множества маленьких красных кружков на основе числового аргумента. По какой-то причине цикл for никогда не выполняется - я уверен, потому что первый оператор console.log выполняется (вне цикла), а второй (внутри цикла) никогда не выполняется.


import React from "react";
import { View } from "react-native"
import Svg, { Circle } from "react-native-svg";



const ScoreboardIndicator = (props) => {

    const num = props

    const Indicator = () => {

        return (
            <Svg width="15" height="15" viewBox="0 0 15 15">
                <Circle
                    stroke="#FF0000"
                    fill="#FF0000"
                    cx="7"
                    cy="7"
                    r="7"
                ></Circle>
            </Svg>
        )

    }


    const getIndicators = (num) => {

        const indicators = []

        console.log('num ' + JSON.stringify(num))

        for (let i = 0; i < num; i++) {
            console.log('looping')
            indicators.push(<Indicator/>)
        }

        return indicators;
    }


    return (
        <View style={{flexDirection:'row'}}>
            {getIndicators(num)}
        </View>
    )

}

export default ScoreboardIndicator
...