Javascript React路由器：隐藏或删除特定路径上的组件

我试图隐藏收藏夹页面上的搜索栏-现在当你点击收藏夹页面时，搜索栏仍然会显示出来。这是我的密码：

<div>
   <div>
       <SearchTab search={this.handleSubmit} value={this.handleChange}/>
   </div>
</div>

<Switch className="wrapper2 songContainer">
     <Route exact path="/home" render={props => <SongInfo {...props} artist={this.state.artistName} title={this.state.songTitle} link={this.state.tabId} />} />
     <Route exact path="/favouritetabs" component={FavouriteTabs} />} />
</Switch>

---

在/FavoriteTables路径，我希望搜索被理想地删除或隐藏。这样做的最佳方式是什么

您可以按如下方式实现它：

import React, { Component } from 'react';
import { withRouter, Switch } from 'react-router-dom';

import Route from 'react-router-dom/Route';


export class AppView extends Component {
    constructor(props) {
        super(props);
        this.state = {
            location: '/'
        }

    }

    componentDidMount() {

        this.unlistenHistory = this.props.history.listen((location, action) => {

            this.setState(_ => ({ location: location.pathname }));
        });
    }
    componentWillUnmount() {

        this.unlistenHistory();
    }

    render() {
        const { location } = this.state;
        return (
            <div className='app-view'>
                <div>
                    <div>
                        {
                            location !== '/favouritetabs' &&
                            <SearchTab search={this.handleSubmit} value={this.handleChange} />
                        }
                    </div>
                </div>

                <Switch className="wrapper2 songContainer">
                    <Route exact path="/home" render={props => <SongInfo {...props}
                        artist={this.state.artistName} title={this.state.songTitle}
                        link={this.state.tabId} />} />
                    <Route exact path="/favouritetabs" component={FavouriteTabs} />
                </Switch>
            </div>
        )
    }
}

export default withRouter(AppView);

---

您可以移除交换机外部的搜索组件，然后将其放入需要的其他组件中。或者使用react router提供的路径，检查是否应该呈现搜索组件。