如何在活动选项卡上仅显示TabBar标签？

<style>
    .tab-content {
        display: none;
    }
    
    .tab-content.active {
        display: block;
    }
</style>

<div class="tab-bar">
    <div class="tab" onclick="showTab('tab1')">Tab 1</div>
    <div class="tab" onclick="showTab('tab2')">Tab 2</div>
    <div class="tab" onclick="showTab('tab3')">Tab 3</div>
</div>

<div class="tab-content active" id="tab1">
    <!-- Tab 1 内容 -->
</div>

<div class="tab-content" id="tab2">
    <!-- Tab 2 内容 -->
</div>

<div class="tab-content" id="tab3">
    <!-- Tab 3 内容 -->
</div>

<script>
    function showTab(tab) {
        // 隐藏所有选项卡内容
        var tabContents = document.getElementsByClassName("tab-content");
        for (var i = 0; i < tabContents.length; i++) {
            tabContents[i].classList.remove("active");
        }
        
        // 显示选中的选项卡内容
        var selectedTab = document.getElementById(tab);
        selectedTab.classList.add("active");
    }
</script>

import React from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';

const TabBar = () => {
    return (
        <div className="tab-bar">
            <Link to="/tab1">Tab 1</Link>
            <Link to="/tab2">Tab 2</Link>
            <Link to="/tab3">Tab 3</Link>
        </div>
    );
};

const TabContent = ({ match }) => {
    return (
        <div>
            <Route path={`${match.url}/tab1`} component={Tab1} />
            <Route path={`${match.url}/tab2`} component={Tab2} />
            <Route path={`${match.url}/tab3`} component={Tab3} />
        </div>
    );
};

const Tab1 = () => {
    return (
        <div>
            {/* Tab 1 内容 */}
        </div>
    );
};

const Tab2 = () => {
    return (
        <div>
            {/* Tab 2 内容 */}
        </div>
    );
};

const Tab3 = () => {
    return (
        <div>
            {/* Tab 3 内容 */}
        </div>
    );
};

const App = () => {
    return (
        <Router>
            <div>
                <Route path="/" component={TabBar} />
                <Route path="/" component={TabContent} />
            </div>
        </Router>
    );
};

export default App;