在學習中遇到這個問題，怎么翻譯都沒明白（果然看英文水平還不夠?。K于搞明白，記錄下面，如果存在漏洞，望指正！

• 有<switch>標簽

            <BrowserRouter>
                <div>
                    <div>
                        <ul>
                            <li>
                                <Link to="/Guide/ContactUs">ContactUs</Link>
                            </li>
                        </ul>
                    </div>
                    <Switch>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                    </Switch>
                </div>
            </BrowserRouter>

結(jié)果為：

解釋：

有<Switch>標簽，則其中的<Route>在路徑相同的情況下，只匹配第一個，這個可以避免重復匹配；

• 無<switch>標簽

            <BrowserRouter>
                <div>
                    <div>
                        <ul>
                            <li>
                                <Link to="/Guide/ContactUs">ContactUs</Link>
                            </li>
                        </ul>
                    </div>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                </div>
            </BrowserRouter>

結(jié)果為：

解釋：

無<Switch>標簽，則其中的<Route>在路徑相同的情況下全都會匹配。更嚴重的是，還會匹配上級路徑的，如下面例子：

            <BrowserRouter>
                <div>
                    <div>
                        <ul>
                            <li>
                                <Link to="/Guide/AboutUs">AboutUs</Link>
                            </li>
                        </ul>
                    </div>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                        <Route path="/Guide/ContactUs" component={ ContactUs } ></Route>
                        <Route path="/Guide" component={ AboutUs } ></Route>
                </div>
            </BrowserRouter>

結(jié)果為：

結(jié)論：為了更好地匹配規(guī)則，輕易不要舍棄<Switch>。