reactjs - React.js 中的点模式

Question

这是来自 Figma 的图片，关于如何渲染图中所示的点有任何想法吗？我使用引导卡来显示配置文件详细信息。下面是卡片组件的代码。

import React, { Component } from 'react';
import { Card } from "react-bootstrap";

class CardComponent extends Component {
    styles = {
        borderRadius: "5px",
        boxShadow:
          "0px 4px 28px rgba(0, 0, 0, 0.15)",
      };
    render() { 
        return ( 
            <div>
                <Card className="m-5" style={{border:"0px"}}>
                  <Card.Img
                    variant="top"
                    src={this.props.img_src}
                    height="10%"
                    width="10%"
                    style={this.styles}
                  />
                  <Card.Body>
                    <Card.Title>{this.props.name}</Card.Title>
                    <Card.Text>{this.props.title}</Card.Text>
                  </Card.Body>
                </Card>
            </div>
         );
    }
}
 
export default CardComponent;

标签： reactjsbootstrap-4react-bootstrap