vue3獲取當(dāng)前路由地址
正解
使用useRouter
:
// router的 path: "/user/:uid" <template> <div>user</div> <p>uid: {{ uid }}</p> </template> <script lang="ts"> import { defineComponent } from "vue"; import { useRouter } from "vue-router"; export default defineComponent({ name: "User", setup() { const router = useRouter(); const uid = router.currentRoute.value.params.uid; return { // 返回的數(shù)據(jù) uid, }; }, }); </script>
解釋一下
useRouter()
返回的是object
, 類似于vue2的this.$router
而router.currentRoute
是RefImpl
對象, 即我們使用ref
返回的對象, 通過.value
可以訪問到當(dāng)前的路由, 類似于vue的this.$route
使用console.log
打印出來看看:
到此這篇關(guān)于vue3獲取當(dāng)前路由地址的文章就介紹到這了。希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
解決element-ui里的下拉多選框 el-select 時,默認(rèn)值不可刪除問題
這篇文章主要介紹了解決element-ui里的下拉多選框 el-select 時,默認(rèn)值不可刪除問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08使用axios發(fā)送post請求,將JSON數(shù)據(jù)改為form類型的示例
今天小編就為大家分享一篇使用axios發(fā)送post請求,將JSON數(shù)據(jù)改為form類型的示例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10vue項(xiàng)目自適應(yīng)屏幕分辨率實(shí)現(xiàn)步驟
這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目自適應(yīng)屏幕分辨率實(shí)現(xiàn)的相關(guān)資料,作為前端人員,為了適配各種型號的電腦、手機(jī),我們往往離不開屏幕分辨率的適配,需要的朋友可以參考下2023-09-09