react路由重定向时 exact的作用 报错Warning: You tried to redirect to the same route you're currently on: "/index"

//Redirect重定向
class RouterIndex extends Component{
    render(){
        return (
            <Switch>
                <Route path="/" render={()=>(
                    <Redirect to="/index" />
                    
                )} />
                
                <Route path="/index" component={Index} />
                <Route path="/book" component={Book} />
                <Route path="/user" component={User} />
                <Route path="/about" component={About} />
                <Route path="/details" component={Details} />

            </Switch>
        )
    }
}
export default RouterIndex;

  报错Warning: You tried to redirect to the same route you're currently on: "/index"，修改路径时i无法显示页面内容

在需要重定向的组件里添加exact就可解决

//Redirect重定向
class RouterIndex extends Component{
    render(){
        return (
            <Switch>
                <Route exact path="/" render={()=>(
                    <Redirect to="/index" />
                    
                )} />
                
                <Route path="/index" component={Index} />
                <Route path="/book" component={Book} />
                <Route path="/user" component={User} />
                <Route path="/about" component={About} />
                <Route path="/details" component={Details} />

            </Switch>
        )
    }
}
export default RouterIndex;

解析：

<Route>组件有如下属性：

path （striing）:路由匹配路径。（没有path属性的Route总是会匹配）；

exact  （boolean）：为true时，则要求路径与location.pathname必须完全匹配

strict（boolean）：为true的时候，有结尾斜线的路径只能匹配有斜线的location.pathname

 

1、exact

exact是Route下的一条属性，一般而言，react路由会匹配所有匹配到的路由组件，exact能够使得路由的匹配更严格一些。

exact为true时表示严格匹配，为false时为正常匹配。

如果exact为true时，'/index'和‘/’是不匹配的，但是在false的情况下它们又是匹配的。