問題描述

想實(shí)現(xiàn)的效果: 點(diǎn)擊連接，新建一個(gè)多標(biāo)簽頁面，在這個(gè)多標(biāo)簽頁面里面展示路由對(duì)應(yīng)的頁面(類似easyui的多標(biāo)簽)

問題: 我看網(wǎng)上的教程都是， 點(diǎn)擊一個(gè)鏈接，會(huì)覆蓋上一個(gè)鏈接的頁面。我的內(nèi)容區(qū)域 永遠(yuǎn)只有一個(gè)頁面，是不是單頁面應(yīng)用無法實(shí)現(xiàn)我想要的效果

問題解答

題主的這個(gè)問題我反反復(fù)復(fù)看了3遍，不知道題主想表達(dá)的是是不是 a 標(biāo)簽的 taregt 屬性實(shí)現(xiàn)的效果。。。

https://developer.mozilla.org...

target該屬性指定在何處顯示鏈接的資源。 I在HTML4，這是的名稱，或?yàn)橐粋€(gè)關(guān)鍵字，一個(gè)框。 HTML5中，它是一個(gè)名字或關(guān)鍵字為，一個(gè)瀏覽上下文（例如，標(biāo)簽，窗口，或內(nèi)嵌框架）。以下關(guān)鍵字具有特殊的意義:_self: 當(dāng)前頁面加載，即當(dāng)前的響應(yīng)到同一HTML 4 frame（或HTML5瀏覽上下文）。此值是默認(rèn)的，如果沒有指定屬性的話。_blank: 新窗口打開，即到一個(gè)新的未命名的HTML4窗口或HTML5瀏覽器上下文_parent: 加載響應(yīng)到當(dāng)前框架的HTML4父框架或當(dāng)前的HTML5瀏覽上下文的父瀏覽上下文。如果沒有parent框架或者瀏覽上下文，此選項(xiàng)的行為方式相同_self。_top: IHTML4中：加載的響應(yīng)成完整的，原來的窗口，取消所有其它frame。 HTML5中：加載響應(yīng)進(jìn)入頂層瀏覽上下文（即，瀏覽上下文，它是當(dāng)前的一個(gè)的祖先，并且沒有parent）。如果沒有parent框架或者瀏覽上下文，此選項(xiàng)的行為方式相同_self。只有在href屬性存在才能使用該屬性。

這種單頁很好實(shí)現(xiàn)的：

如果是Angular2：

寫一個(gè)Service用來存儲(chǔ)Tab（如果刷新后Tab還有的話，最好用localStorage）。

在原始的IFrame位置，放置路由<outlet></outlet>，Angular2用來替換為路由輸出的。

上面的Tab就是一個(gè)簡(jiǎn)單數(shù)組，對(duì)應(yīng)Tab標(biāo)題和路由。點(diǎn)擊后跳轉(zhuǎn)到指定路由，就會(huì)根據(jù)路由配置，自動(dòng)替換<outlet></outlet>的內(nèi)容。

但是有一個(gè)問題就是，因?yàn)槭侵苯犹鎿Q的，所有最好保存頁面狀態(tài)，要不切換回來又是初始化的界面。

這只是一種簡(jiǎn)單的方案，更好的還是每個(gè)Tab單獨(dú)分開。

題主，我也遇到這個(gè)問題了，請(qǐng)問題主解決了嗎