React Native 实现一竖排圆圈：使用 View 和 StyleSheet

可以使用 RN 的 StyleSheet 和 View 组件来实现一竖排圆圈。具体步骤如下：

1. 创建一个样式表，定义圆圈的样式：

const styles = StyleSheet.create({
  circle: {
    width: 20,
    height: 20,
    borderRadius: 10,
    backgroundColor: 'red',
    marginVertical: 5,
  },
});

2. 在 View 组件中使用循环语句生成一组圆圈：

<View>
  {[...Array(5)].map((_, i) => (
    <View key={i} style={styles.circle} />
  ))}
</View>

其中，[...Array(5)] 表示生成一个长度为 5 的数组，map 方法遍历这个数组，生成 5 个圆圈。

完整代码如下：

import React from 'react';
import { View, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  circle: {
    width: 20,
    height: 20,
    borderRadius: 10,
    backgroundColor: 'red',
    marginVertical: 5,
  },
});

export default function App() {
  return (
    <View>
      {[...Array(5)].map((_, i) => (
        <View key={i} style={styles.circle} />
      ))}
    </View>
  );
}

运行效果如下：