Вкладки React Boostrap не отображают содержимое вкладок

Я видел, что этот вопрос задавался раньше, но не видел ответа. На данный момент у меня есть две вкладки, но ни на одной из них нет содержимого. Я вернул все это обратно к его самому основному функционированию. Я не пытаюсь отобразить компонент на вкладке; просто h1 пока. Основываясь на комментарии здесь, я добавил ссылку в заголовок мой index.html, и он все еще упрямо не показывается. Вот с чем я работаю:

import React, { Component, useState } from 'react';
import Tabs from 'react-bootstrap/Tabs';
import Tab from 'react-bootstrap/Tab';

export class GameHome extends Component {
    static displayName = GameHome.name;

    constructor(props) {
        super(props);
        this.state = {

        };
        this.componentDidMount = this.componentDidMount.bind(this);
    }

    componentDidMount() {
    }
 
    render = () => {

        return (
            <Tabs defaultActiveKey="tab1" id="uncontrolledTabs">
                <Tab eventKey="tab1" title="Tab 1">
                    <h1>Tab 1</h1>
                </Tab>
                <Tab eventKey="tab2" title="Tab 2">
                    <h1>Tab 2</h1>
                </Tab>
            </Tabs>
        );
    }
}

person Hugh Daggs    schedule 14.03.2021    source источник
comment
Вы можете добавить песочницу, воспроизводящую вашу проблему? код выглядит нормально, за исключением того, что вам не нужно привязывать componentDidMount   -  person buzatto    schedule 15.03.2021