在反应中使用antd组件时出错答案

【问题标题】：Error while using antd components in react在反应中使用antd组件时出错
【发布时间】：2021-09-07 17:20:05
【问题描述】：

我正在使用antd组件进行ui设计，而使用这些组件时，有些组件可以工作，有些则不行。

进口所有组件

进口{ 桌子，排版，选择，空间，排，科尔，形式，按钮，布局，标签，徽章，标题，内容，分频器，进步，文本 } 来自“antd/lib”；

<Row>
  <Col span={12} />
    <Col span={12} pull={5}></Col>
      <Layout>
        <Content style={{ padding: "30px 20px" }}>
          <div style={{ padding: 24, backgroundColor: "#fff" }}>
            <Title level={4}>Coverage Report</Title>
            <Divider />
             <Row justify="space-between">
               <Col span={6}></Col>
               <Col span={6}>
                 <Progress type="circle" percent={100} />
               </Col>
               <Col span={6} style={{ marginTop: "50px" }}>
                 <Text strong>
                   {data.length - selectedRowKeys.length} tests are available to test
                 </Text>
               </Col>
               <Col span={6}></Col>
             </Row>
           </div>
         </Content>
       </Layout>
     </Row>

Row、Col 和 Layout 组件没有问题，因为我在此代码之前已经使用过这些组件，问题在于其他组件，例如 Content、Title、Text 和 Progress。

Antd 版本 - ^4.7.2 反应 - ^17.0.1

【问题讨论】：

标签： reactjs react-redux antd

【解决方案1】：

我相信这是因为您没有正确导入内容、标题和文本。查看标题和文本的文档是排版的一部分。

const {Title, Text} = Typography;
const {Content} = Layout;

【讨论】：