React-native: Why rendering an empty view component creates an error while a text component runs?

I am trying to create an array of View components in react-native that are passed to a parent component. The code below does not work, however if i use Text instead of View it works. I want use view to show empty or filled circles. I couldn't find the reason for it and i assume it should be possible to use an empty view. What am i doing wrong?

class card extends React.Component {renderScore(balance, fulfill, markImage){    var scores = [];    for (i = 1; i <= fulfill; i++) {         if(i<=balance){            if (markImage) {               scores.push(<View style={styles.emptyCircle} key={i}>  </View>);               //scores.push(<View style={styles.emptyCircle} key={i}> <Image source={{uri: markImage}} style={styles.markImage}/> </View>);            }            else{                   scores.push(<View style={styles.emptyCircle} key={i}> <View style={styles.punchCircle}></View> </View>);            }            }        else        {            scores.push(<View style={styles.emptyCircle} key={i}>  </View>);        }    }    return(scores);    }}

This will give 'RawText "" must be wrapped in an explicit component.'

However if use

 scores.push(<Text style={styles.emptyCircle} key={i}>  </Text>);

it works.

It is called from a ListView as

_renderCard(item){var cardBottom = new cardRenderer();var childView = cardBottom.renderScore(item.balance, item.fulfill, item.markImage);console.log(childView);return(<View style={styles.mainConatiner}><View style={styles.leftConatiner}><Image      source={{uri: item.avatarLeft}}      style={styles.thumbnail}      /></View><View style={styles.rightConatiner}><View style={styles.rightUpConatiner}><Text style={styles.title}>{item.title}</Text><Text style={styles.title}>{item.subTitle}</Text><Text style={styles.title}>{item.expires}</Text></View><View style={styles.rightDownConatiner}>{childView}</View></View></View>);

}