css - 如何将嵌入式 radio 控件放入React-Bootstrap？

Question

我正在用React-Bootstrap和Typescript编写个人的Electron元素，但是我不能将两个 radio 控件彼此相邻。我关注了the React-Bootstrap examples，但无法正常工作。我不确定是只是我还是想念什么。我还尝试将内联 Prop 提供给Form组件，并在不包含Container和Row组件的情况下编写它。我知道可以在Bootstrap中使用flex结构来完成操作，但是我只愿意使用React-Bootstrap组件。

import React from 'react';
import { Container, Row, Form  } from 'react-bootstrap';


const ExperimentTypeForm = () => {
  return (
    <Container fluid>
      <Row>
        <Form>
          <div key="inline-radio" className="mb-3">
            <Form.Check inline label="1" type="radio" id="inline-radio-1" />
            <Form.Check inline label="2" type="radio" id="inline-radio-2" />
          </div>
        </Form>
      </Row>
    </Container>
  )
}

export default ExperimentTypeForm;

Answer 1

我缺少从Bootstrap导入的.css:

import 'bootstrap/dist/css/bootstrap.min.css';

起初我忽略了它，因为由于webpack配置文件中缺少一些配置而无法编译它。但是经过一番挖掘之后，我发现了关于如何将Bootstrap样式表添加到App.tsx组件的this great answer。