這篇文章主要介紹vue中的router-link屬性是什么，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

成都創(chuàng)新互聯(lián)專注于成都網(wǎng)站設(shè)計、網(wǎng)站制作、網(wǎng)頁設(shè)計、網(wǎng)站制作、網(wǎng)站開發(fā)。公司秉持“客戶至上,用心服務(wù)”的宗旨,從客戶的利益和觀點出發(fā),讓客戶在網(wǎng)絡(luò)營銷中找到自己的駐足之地。尊重和關(guān)懷每一位客戶，用嚴謹?shù)膽B(tài)度對待客戶，用專業(yè)的服務(wù)創(chuàng)造價值，成為客戶值得信賴的朋友，為客戶解除后顧之憂。

vue中的router-link屬性有以下屬性值：to相當于herf標簽用于添加跳轉(zhuǎn)內(nèi)容，replace用于頁面切換時不會留下歷史記錄以及tag將router-link渲染成相應(yīng)的標簽等等

在vue中，vue.js與 vue-router 兩者結(jié)合在一起可以實現(xiàn)簡單的單頁面應(yīng)用，其中是一個組件，主要用于設(shè)置導(dǎo)航的鏈接來實現(xiàn)不同的HTML內(nèi)容切換。

router-link標簽

在vue1.0版本中的仍然用a標簽來實現(xiàn)鏈接跳轉(zhuǎn)功能，但鏈接地址與html中不同，它是采用v-link屬性來控制。但是在2.0版本中a標簽就被替換成了rount-link屬性，但是最終在頁面上顯示還是會被渲染成a標簽。接下來將要詳細的介紹該屬性中的各個值的用法

router-link屬性值詳解

（1）":to" 屬性值

這個屬性值就相當于a標簽中的"herf"屬性，后面的內(nèi)容為跳轉(zhuǎn)鏈接的內(nèi)容

創(chuàng)新互聯(lián)

相當于

replace屬性值在routre-link標簽中添加的主要目的在于頁面切換時不會留下歷史記錄
（3）"tag" 屬性值
具有tag屬性的router-link都會被渲染成相應(yīng)的標簽
創(chuàng)新互聯(lián)
相當于
創(chuàng)新互聯(lián)
此時的頁面中的li同樣會起到a標簽的作用，因為vue會自動為其綁定點擊事件，并跳轉(zhuǎn)頁面
（4）"active-class"屬性值
這個屬性是用于設(shè)置激活鏈接時class屬性，也就是當前頁面及所有與當前頁面地址所匹配的的鏈接都會被添加class屬性
創(chuàng)新互聯(lián)
active-class屬性的默認值是router-link-active,所以如果沒有設(shè)置，就會被渲染為這個class
（5）“append”屬性值
設(shè)置 append 屬性后，則在當前 (相對) 路徑前添加基路徑。例如，我們從 /a 導(dǎo)航到一個相對路徑 b，如果沒有配置 append，則路徑為 /b，如果配了，則為 /a/b
使用router-link代替a標簽的好處
router-link屬性在頁面中可以渲染為任何元素，比如上述代碼中渲染成li標簽依然實現(xiàn)了跳轉(zhuǎn)效果。另外當我們點擊a標簽時可能會重載頁面，但是使用router-link后此標簽會被vue所監(jiān)聽，跳轉(zhuǎn)鏈接時就不會刷新頁面了。
以上是“vue中的router-link屬性是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
            
            
                        

            新聞標題：vue中的router-link屬性是什么            

            鏈接地址：http://weahome.cn/article/jhhjog.html