反應路由器中的鏈接和錨標籤之間的不同行爲

Question

我認爲這是一個使用鏈接到錨標籤的約定。根據我的理解，鏈接標記將被轉換成html的錨標記。但是從我的觀察來看，Link會渲染客戶端頁面，並且緩存頁面錨點標記會渲染服務器端的頁面。

下面是代碼，我有其具有方法willTransitionTo

willTransitionTo: function (transition, params, query, callback) { 
     console.log('transition to'); 
    } 

當我有另一個部件，來鏈接該組件，如果我使用鏈接從反應的路由器，該日誌將被以印刷一個部件瀏覽器控制檯。有趣的是，當我鏈接到這個頁面時，它第二次緩存了數據（沒有從網絡中獲取數據）。另一方面，如果我正在使用錨點，日誌將被打印在服務器端控制檯中。

我明白什麼錨，但我不明白爲什麼錨鏈接是客戶端渲染。這是一種預期的行爲嗎？此外，如果Link不知道如何知道如何緩存數據。

非常感謝提前

Answer 1

我不確定你到底在問什麼。我想你問的是爲什麼瀏覽器中的URL改變，而不會產生一個新的HTTP請求。原因是HTML5的歷史。

HTML5歷史記錄允許我們在前端路由中擁有漂亮的網址，而不是基於舊式哈希的網址，即/page而不是/#page。從這個意義上說，React Router只不過是HTML5歷史的一個包裝。

使用HTML5歷史記錄時，務必確保後端配置爲在所有路由中提供頁面。例如您可以將前端從/轉換爲/cart，但如果您重新加載頁面，則如果您的服務器尚未配置爲服務端點/cart，則會收到服務器錯誤。這對於不支持HTML5歷史記錄的舊版瀏覽器（例如IE9）也很重要，它將優雅地降級爲傳統的HTTP請求。

有關HTML5歷史的更多信息，總會有可讀的CSS技巧。 https://css-tricks.com/using-the-html5-history-api/